Spry:Content and Dynamic Spry Data

Is there a way to get the spry:content attribute to work well
with dynamic data generated from PHP/MySQL? I have read the
progressive enhancement article and I am totally lost on it.
The provided examples in the documentation deal with static
data but there are so example of using spry:content and dynamic
data.
Can anyone help?
Thanks

Hi Arnout
These are the urls:
http://www.grafikkaos.co.uk/pages/front/test_home.php
- this one displays the spry:content properly, but in the source,
it does not show the 5 articles.
http://www.grafikkaos.co.uk/pages/front/test_home_2.php
- I applied a PHP repeat region here. In the source, it shows 5
articles being shown but on page view, each title and date is
repeated 5 times.
Any ideas?
Thanks

Similar Messages

Spry:state and dynamic accordion

When I use a dynamic accordion (i.e. populated by a dataSet),
the accordion functionality disappears. Here is my code. Am I doing
something wrong, or is this just a bug?
Thanks
Andy
<div spry:region="dsOrders">
<div spry:state="loading">Data is
loading...</div>
<div spry:state="error">Error loading
data...</div>
<div spry:state="ready">
<div id="orders" class="Accordion">
<div class="AccordionPanel" spry:repeat="dsOrders">
<div class="AccordionPanelTab"><h3
spry:content="{ORDERNUM}"></h3></div>
<div class="AccordionPanelContent"><span
spry:content="{ORDERDATE}"></span></div>
</div>
</div>
</div>
</div>

This might also be helpful to some. Not only do we have
states in SPRY... but events! Here is how I did it on a site that
has a dataset called dsOpportunities. The following HTML/Javascript
was added to the head tags of the HTML. Then the on <body
onload="afterReady()" > was used to make sure it was run.
Remember that your section you are hiding needs to have a class
with the same senario. (Or if it is unique you could do something
simular with ID rather than class.
<script>
function afterReady() {
$('pageContent').style.visibility = 'hidden';
var iSPRY = new Object;
iSPRY.onPostLoad = function(dataSet,data) {
$('pageContent').style.visibility = 'visible';
dsOpportunities.addObserver(iSPRY);
</script>
<style>
.pageContent {
visibility: hidden;
</style>

BPM/File Content and Dynamic File Name

Bit of a double whammy here!
I am running a BPM : R/3 Proxy > XI > BPM > File Adapter (x4)
All working to a point.....
The file I receive splits into two files, then I pass a Count file - number of records to a separate file and then a file that simply says "ready" on completion. Four files are:
Data file, Lookup (values and descripton for legacy), Count file and Ready file.
To top this off, it will be run for 12 separate countries so hope to use the country code to add to the file naming - so generating 48 files (if successful). Data_GB.dat, lookup_GB.dat, Count_GB.dat and ready_GB.dat etc....
The first three, I can do (with maybe a little help!), I have looked at the use of dynamic file naming and think I can do this, however, the count file uses the initial file sent, but the ready file passes across the word "ready" to destination file. How can I utilise the dynamic naming convention if I do not use the original file for this?
Also, the "ready" file is being created but it is empty. It is okay using the the File Adapter, but when I convert it, the file is empty (but still created!) IN sxmb_moni, it is showing correctly but once the file content conversion happens, it is empty!
Any thoughts?

Thanks Bhavesh.
Time Stamp Status Description
2007-05-08 17:43:57 Success Message successfully received by messaging system. Profile: XI URL: http://host.fqdn.net:55000/MessagingSystem/receive/AFW/XI Credential (User): XIISUSER
2007-05-08 17:43:57 Success Using connection File_http://sap.com/xi/XI/System. Trying to put the message into the receive queue.
2007-05-08 17:43:57 Success Message successfully put into the queue.
2007-05-08 17:43:57 Success The message was successfully retrieved from the receive queue.
2007-05-08 17:43:57 Success The message status set to DLNG.
2007-05-08 17:43:57 Success Delivering to channel: EPIW_FTP_Receiver_EmployeeReady
2007-05-08 17:43:57 Success MP: entering
2007-05-08 17:43:57 Success MP: processing local module localejbs/CallSapAdapter
2007-05-08 17:43:57 Success File adapter receiver: processing started; QoS required: ExactlyOnce
2007-05-08 17:43:57 Success File adapter receiver channel EPIW_FTP_Receiver_EmployeeReady: start processing: party " ", service "XE_DEV_3RD_EPIW_001"
2007-05-08 17:43:57 Success Connect to FTP server "ftp.ftp.ftp.ftp", directory "/ECS/Target"
2007-05-08 17:43:57 Success Write to FTP server "ftp.ftp.ftp.ftp", directory "/ECS/Target",   file "xi_epiw_ready20070508-174357-635.dat"
2007-05-08 17:43:57 Success Transfer: "BIN" mode, size 156 bytes, character encoding -
2007-05-08 17:43:57 Success Start converting XML document content to plain text
2007-05-08 17:43:57 Success File processing complete
2007-05-08 17:43:57 Success MP: leaving
2007-05-08 17:43:57 Success The message was successfully delivered to the application using connection File_http://sap.com/xi/XI/System.
2007-05-08 17:43:57 Success The message status set to DLVD.
<?xml version="1.0" encoding="UTF-8" ?>
- <ns0:EPIWReadyFile xmlns:ns0="urn:com.xerox.esap.hr.epiwextract">
<recordReady>READY</recordReady>
</ns0:EPIWReadyFile>
Transfer: Binary
File Type : Text
File Content Conversion:
Record Set Structure: Detail
Detail.fieldSeparator     ,
Detail.endSeparator     'nl'
It maybe something simple...
Hopefully you can help : )
Thanks
Barry

Client independent and Dynamic Test data upload

Hi all,
1. While creating the Script as part Attribute we r specefying Target Sys. to record.
   If i want to execute same script name some other client, without changing the Target sys., is it runs by defining that RFC for that sys. in Sys. Data container?
   2. i am specefying   the location of test data file as part of test data container and sys. data container's.
       Whenever i make the changes in the test data in the Excel Interface, it is not automatically updating in the Test data container or Test configuration?
       Is it req. to go to test data container -> Edit -> Varients -> Upload. each and every time the changes made?
   Any solution with u?
Regards,
Sreedhar

Hi Sreedhar,
Check this link for question # 1... How to parameter Target System in eCATT
For Question # 2, As far as my knowledge goes, once you upload an excel, repository will only store the present copy of the test data, not the shortcut of the excel and then keep on updating for every change that is made in the test data repository. So you will have to upload the again when ever any changes are being made.
Others @ Pl correct me if I was wrong in saying that.
Hope this answer helps.
-Harsha

How to update Spry-table and present the updated table in a div element?

Hello!
I am using a very interesting AJAX-framework called Spry when designing a web page. Here the web page is: Link.
I need some help.
Every time a new project or shift is added, the changes are written to an xml-file. When the page is reloaded, Spry reads data from xml-files.
This is caused by this code:
dsProjects = new Spry.Data.XMLDataSet("timetable/projects.xml", "projects/project");
dsShifts = new Spry.Data.XMLDataSet("timetable/{dsProjects::url}", "project/shift"); //look inside projects.xml and //extrac xml-file. url
dsName = new Spry.Data.XMLDataSet("timetable/{dsProjects::url}", "project");
I call this function that I have written: loadProjectsIntoDivElement ().
This function does the following: [See attached code.]
It iterates through the Spry-datastructure and puts the data in a table inside of the div-element called 'projectsList'.
Now, when I add a new project, I want it to be inserted into the Spry-datastructure and then cause the new data to be written into the div element called 'Specials_DIV'.
I have found out how to update a Spry-datastructure (e.g. dsProjects above), but I don't know how to update the table containing the data without refreshing the page. This should be done using Spry.
Some code:
1:
2:
3:
function loadProjectsIntoDivElement () {
$('#projectsList').html('');
$('#projectsList').append('<table id="Specials_Table"><tr><th spry:sort="id">ID</th><th spry:sort="NAME">Name </th><th spry:sort="hoursestimated">Nr. of hours estimated</th><th spry:sort="hoursworked">Nr. of hours worked</th><th spry:sort="costperhour">Cost per hour.</th></tr>{function::init_hours}<tr spry:repeat="dsProjects" onclick="chooseProject({ds_RowID})"><td>{id}</td><td>{NAME}</td><td>{hoursestimated}</td><td>{hoursworked}</td><td>{costperhour}</td></tr></table><br/>{function::get_hours}<br/>');
I have tried to accomplish this in various ways but I don't succeed.
I want to do it without refreshing the page.
Update: I found some code here that I will try: Link
Thanks in advance!
Anders Branderud
My blog

Hello!
Thanks!
I don't succeed with the implementation in any browser.
I have found a way to it, but I would like a way that updates the data quicker and without reloading all of the page. After all, I am only adding one row on the end of the data structure, so there should be no need to read in all data again.
Now I do it like this:
When a project is added, do this:
1. Store a new row in the project file through a php script.
2. When the post-call to the php-file returns, do refresh of the whole page.
Then the newest version of the xml file will be read in.
However, I don't want to read the data from a xml file each time that a new project is created.
I know how to add the new data to a Spry-datastructure [in my code 'dsProjects'], but I don't know how to display the updated data without reloading the whole page.
I have tried some various ways to do it, but haven't succeded.
Thanks!
Anders Branderud

Templates and Dynamic Memory Allocation Templates

Hi , I was reading a detailed article about templates and I came across the following paragraph
template<class T, size_t N>
class Stack
T data[N]; // Fixed capacity is N
size_t count;
public:
void push(const T& t);
};"You must provide a compile-time constant value for the parameter N when you request an instance of this template, such as *Stack<int, 100> myFixedStack;*
Because the value of N is known at compile time, the underlying array (data) can be placed on the run time stack instead of on the free store.
This can improve runtime performance by avoiding the overhead associated with dynamic memory allocation.
Now in the above paragraph what does
"This can improve runtime performance by avoiding the overhead associated with dynamic memory allocation." mean ?? What does template over head mean ??
I am a bit puzzled and i would really appreciate it if some one could explain to me what this sentence means thanks...

The run-time memory model of a C or C++ program consists of statically allocated data, automatically allocated data, and dynamically allocated data.
Data objects (e.g. variables) declared at namespace scope (which includes global scope) are statically allocated. Data objects local to a function that are declared static are also statically allocated. Static allocation means the storage for the data is available when the program is loaded, even before it begins to run. The data remains allocated until after the program exits.
Data objects local to a function that are not declared static are automatically allocated when the function starts to run. Example:
int foo() { int i; ... } Variable i does not exist until function foo begins to run, at which time space for it appears automatically. Each new invocation of foo gets its own location for i independent of other invocations of foo. Automatic allocation is usually referred to as stack allocation, since that is the usual implementation method: an area of storage that works like a stack, referenced by a dedicated machine register. Allocating the automatic data consists of adding (or subtracting) a value to the stack register. Popping the stack involves only subtracting (or adding) a value to the stack register. When the function exits, the stack is popped, releasing storage for all its automatic data.
Dynamically allocated storage is acquired by an explicit use of a new-expression, or a call to an allocation function like malloc(). Example:
int* ip = new int[100]; // allocate space for 100 integers
double* id = (double*)malloc(100*sizeof(double)); // allocate space for 100 doublesDynamic storage is not released until you release it explicitly via a delete-expression or a call to free(). Managing the "heap", the area from where dynamic storage is acquired, and to which it is released, can be quite time-consuming.
Your example of a Stack class (not to be confused with the program stack that is part of the C or C++ implementation) uses a fixed-size (that is, fixed at the point of template instance creation) automatically-allocated array to act as a stack data type. It has the advantage of taking zero time to allocate and release the space for the array. It has the disadvantages of any fixed-size array: it can waste space, or result in a program failure when you try to put N+1 objects into it, and it cannot be re-sized once created.

Spry Tabbed panels + Progressive Enhancement and Dynamic Loading of Content With Spry

Is there any way to combine tabbed panels together with "Progressive Enhancement and Dynamic Loading of Content With Spry"?
Visit: http://labs.adobe.com/technologies/spry/articles/best_practices/progressive_enhancement.ht ml#updatecontent
And click on the "Using Spry.Utils.updateContent()"
The 3rd example shows how to use a fade transition whenever the content changes.
I already have tabbed panels. My menu contains buttons (on tabs) and my Content div contains the panels.
Tabs code;
<ul class="TabbedPanelsTabGroup">
          <li class="TabbedPanelsTab">
               <table class="Button" >
                    <tr>
                    <td style="padding-right:0px" title ="Home">
                    <a href="javascript:TabbedPanels1.showPanel(1);" title="Home" style="background-image:url(/Buttons/Home.png);width:172px;height:75px;display:block;"><br/></a>
                    </td>
                    </tr>
               </table>
          </li>
etc
etc
etc
and the panel code:
<div class="TabbedPanelsContent" id="Home">
     CONTENT
</div>
I hoped i can use the example code from the link into my tabbed panels.
I thought this code:
onclick="FadeAndUpdateContent('event', 'data/AquoThonFrag.html'); return false;"
could be added to the tab code like this:
<a href="javascript:TabbedPanels1.showPanel(1);" onclick="FadeAndUpdateContent('event', 'data/AquoThonFrag.html'); return false;" title="Home" style="background-image:url(/Buttons/Home.png);width:172px;height:75px;display:block;"><br/></a>
But the content doesnt fade...
I know i need to change the header etc.
The following is from the link:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:spry="http://ns.adobe.com/spry">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Aquo Events</title>
<script src="../../../includes/SpryEffects.js" type="text/javascript"></script>
<script src="../../../includes/SpryData.js" type="text/javascript"></script>
<script type="text/javascript">

</script>
<style type="text/css">
/* IE HACK to prevent bad rendering when fading. */
#event { background-color: white; }
</style>
</head>
So i changed my header etc, put the SpryEffects.js and SpryData.js into position and nothing changed...
Is there a way to keep my tabbed panel (or change as less as possible) and let
A. The fade work
B. The loading work.
The problem now is that it loads all pages instead of only the home. Therefore i wanted this Progressive Enhancement.
And the fading part is just because its nice...

It doesnt show in the post but off course i changed this link;
"data/AquoThonFrag.html"
into;
"javascript:TabbedPanels1.showPanel(1);"
I must say i dont know if this even works...

Spry Tables and Xml Data Sets viewed in IE7

Has anyone ever run into a problem with Spry Tables and Xml
Data Sets viewed in IE7? Work fine in IE6 and Firefox, but get the
error "exception caught while loading feed.xml: [object Error]" in
IE 7. Any ideas?
Attached is the xml I'm using.
Thanks

I came looking for the answer to this question. I could not
find an answer. Eventually I found it the answer that worked for
me, a graphic designer with not much experience in xml.
The following url provided an errata file in PDF format:
www.peachpit.com/dwcs3cib
which includes the following addendum to the incomplete
instructions in the book i was using to learn about spry:
"If Internet Explorer 7 is your primary browser, you'll nee
to take some extra steps to view spry dynamic content locally.
First, your site must be within the local server webroot; be sure
your Lessons folder is stored within the Inetpub>wwwroot folder.
Next, double-click the site name in the files panel to open the
Site Definition dialogue. Click the Testing Server category; from
the Access List choose Local/Network. Click Okay to close the Site
Definition dialogue. Now, when you preview your page with Internet
Explorer, your local Web server (localhost) serves the page as
designed."
Horray for me! Now i can move on from here and actually get
some work done!

Spry Accordian and 2 data Sets

I have created a nested accordian with 2 data sets feeding a
detail region. It works on my machine, but after I uploaded
everything, including the spry js and css files, it still just
shows the {data} markers on the live version. Does anyone know
where the error is? I've tried reuploading it all but it still is
the same.
Here is the link:
http://clubs.wharton.upenn.edu/winterwk/Subs/students09W.html
Thanks!

you are missing
SpryData.js, SpryShell.js, xpath.js in your includes
folder.

Dynamic Spry Tooltips

I have a glossary XML document that I use Data Sets in our website.
I want to be able to dynamically traverse the XML DOM to be able to pull the innerXML to insert into Spry Tooltip dynamically.
The approach I am taking is to dynamically load a hidden Iframe with the XML Document, then parse the XML to filter out the content I need for each temr that has definition associated with it. However, I can not seem to get past this point to load into the tooltip div container.
Any suggestions?

In case you missed it
                        Announcement:
                        New to Spry, or the Spry forums?
Before you post a topic please verify that:
You are using the latest Spry files
The
latest version of the Adobe Spry Framework is 1.6.1, this is the same
version that ships with Dreamweaver CS4. If you use Dreamweaver CS3
(uses Spry 1.4), its wise to upgrade your files to the latest version.
This can easily be done using the Spry Updater that can be found here.
Your question was not asked before
Using
the search functionality on forums you can easily find out if your
question has been answered before. While you are in search, you can
specify the search locations. The Spry forum can be found under:
Adobe Labs > Spry Framework for Ajax
Yoru question can not be found in the existing documentation
Spry
provides you with allot of documentation this can found on different
locations. In the sidebar of this forum you can find a small summary of
resources that will help you on your way.
If
these options do not apply to your question, please be so kind to also
supply the following information in your topic together with a clear
description of your issue:
What browsers does this issue occure:
example: Internet Explorer 8 on Window 7 and Firefox 3.0 on Mac OSX
What version of Spry are using:
example: Spry 1.6.1 ( the version number can be found in license header of the .css and .js files )
What is the url of your website or page in issue:
example: http://www.example.com/page/in/issue.html
Step to reproduce the issue:
example:
Scroll down till you find the header "help", there you will see a Spry
Accordion. When you click on it it will not open or close.
So users can provide you with a better answer, without having to ask you for further details.
                        by Arnout Kazemier
                        at Oct 23, 2009 2:47 PM

How do I get rid of the white space between my header and my spry navigation bar?

I have been grappling with a problem for the past 2 days and cannot seem to work my way around it. I have been working on a page in dreamweaver cs4 that seems to have whitespace between the header and my spry menu bar ONLY in Firefox. Google Chrome and Safari show it correctly. Could you steer me in the right direction for getting rid of that space. Here is the page: http://www.margaritascafe.com/margaritas_layout.html
Here is my code and thanks in advance for your help:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<link href="margaritastyles.css" rel="stylesheet" type="text/css" />
<script src="Margaritas_temp_spry/SpryMenuBar.js" type="text/javascript"></script>
<script src="Scripts/swfobject_modified.js" type="text/javascript"></script>
<link href="Margaritas_temp_spry/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="wrapper">
<div id="header">
    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="1000" height="250" id="FlashID" tabindex="10" title="Margarita's Cafe header 2">
      <param name="movie" value="flash_movies/Margaritas Header 3.swf" />
      <param name="quality" value="high" />
      <param name="wmode" value="opaque" />
      <param name="swfversion" value="9.0.45.0" />
      
      <param name="expressinstall" value="Scripts/expressInstall.swf" />
      
      
      <object type="application/x-shockwave-flash" data="flash_movies/Margaritas Header 3.swf" width="1000" height="250">
        
        <param name="quality" value="high" />
        <param name="wmode" value="opaque" />
        <param name="swfversion" value="9.0.45.0" />
        <param name="expressinstall" value="Scripts/expressInstall.swf" />
        
        <div>
          <h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
          <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" width="112" height="33" /></a></p>
        </div>
        
      </object>
      
    </object>
</div>
<div id="navigation">
    <ul id="MenuBar1" class="MenuBarHorizontal">
      <li><a href="#">Home</a></li>
      <li><a href="#" class="MenuBarItemSubmenu">Menus</a>
        <ul>
          <li><a href="#">Lunch</a></li>
          <li><a href="#">Dinner</a></li>
          <li><a href="#">Cocktail</a></li>
          <li><a href="#">Take Out</a></li>
        </ul>
      </li>
      <li><a href="#">Photos</a></li>
      <li><a href="#" class="MenuBarItemSubmenu">Catering</a>
        <ul>
          <li><a href="#">Private Parties</a></li>
        </ul>
      </li>
      <li><a href="#">Reservations</a></li>
      <li><a href="#">Contact</a></li>
      <li><a href="#">Reviews</a></li>
      <li><a href="#">Directions</a></li>
    </ul>
</div>
<div id="maincontentlayout3">Content for id "maincontentlayout3" Goes Here</div>
<div id="specials"><img src="png-gif-jpg/Tuesday Night Banner.jpg" width="200" height="70" alt="Margarita's Tuesday Night Special" /><img src="png-gif-jpg/Wednesday Banner.jpg" width="200" height="70" alt="Wednesday 2 for 1 dinner special at Margarita's" /><img src="png-gif-jpg/Thursday Banner.jpg" width="200" height="70" alt="Ladie's Night Thursdays at Margarita's Cafe" /><img src="png-gif-jpg/Friday Banner.jpg" width="200" height="70" alt="TGIF Happy Hour on Friday's at Margarita's Cafe" /><img src="png-gif-jpg/Sunday Banner.jpg" width="200" height="70" alt="Sunday Kids Eat Free at Margarita's Cafe!" /></div>
<div id="footer"><img src="png-gif-jpg/Margaritas Facebook logo.png" alt="Facebook" width="40" height="25" align="absmiddle" /> <img src="png-gif-jpg/Margaritas Twitter logo.png" alt="Twitter Logo" width="40" height="25" align="absmiddle" /><img src="png-gif-jpg/merchantcircle_mini.png" alt="Merchant Circle Logo" width="63" height="25" align="absmiddle" /></div>
</div>
<script type="text/javascript">

</script>
</body>
</html>

CSS:
#navigation {margin-top: -3px;}
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb

Spry Accordions and Contribute

I'm curious of something.. been trying to search for anyone
who has a similar problem and can't seem to find an answer..
I've recently built a site using the DW CS3 Spry Accordion,
and the client is updating the file with Contribute CS3. They can
get in and edit the files just fine (contribute expands the
accordions so the content is editable), but when they 'publish' the
file the accordion stays expanded. The data in the accordions are
quite lengthy, so it's pretty necessary they collapse again.
Anyone else see this with the Spry stuff? I've had clients
update the Spry Tabbed menus with the same version of Contribute,
and everything works just fine. This one is a mystery!
I have version 1.6.1 of Spry. The editing file in question is
standard CSS/XHTML.
Any advice/help would be great! Thank you!
-s

Think I found the bug.. It's actually a combo of the footer
script between the Accordion and Google's Analytics script:
Link
to Article

Using spry to filter age or date range?

I'm trying to create a spry filter to filter between age or date ranges. I can get the code to filter an age if it's greater or below a number, but not a range between numbers. How can I modify the following code to filter between a range of numbers? I would prefer to use drop down for age range choices so the user can choose each age from a drop down menu but I wasn't having much luck with it whereas the checkbox was somewhat working for me. If someone has a drop down method to select ages and have spry filter between the values I would be very grateful. Many thanks in advance!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:spry="http://ns.adobe.com/spry">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Multiple Filters Sample</title>
<link href="http://labs.adobe.com/technologies/spry/css/samples.css" rel="stylesheet" type="text/css" />
<script language="JavaScript" type="text/javascript" src="http://labs.adobe.com/technologies/spry/includes/xpath.js"></script>
<script language="JavaScript" type="text/javascript" src="http://labs.adobe.com/technologies/spry/includes/SpryData.js"></script>
<script language="JavaScript" type="text/javascript" src="http://labs.adobe.com/technologies/spry/includes/SpryDataExtensions.js"></script>
<script type="text/javascript">

</script>
</head>
<body>
<div class="liveSample" style="float: left; margin-bottom: 4px;">
     <form action="">
     <label>Show '1' - '5': <input name="f15" type="checkbox" value="" onclick="ToggleFilter(this.checked, ff15);" /></label><br />
     <label>Show '6' - '10': <input name="fIP" type="checkbox" value="" onclick="ToggleFilter(this.checked, ffIP);" /></label><br />
     <label>Show '11' - '20': <input name="fQZ" type="checkbox" value="" onclick="ToggleFilter(this.checked, ffQZ);" /></label><br />
     <input type="button" value="Remove All Filters" onclick="RemoveAllFilters();" />
     </form>
     <div spry:region="dsStates" spry:repeatchildren="dsStates">
          <span>{name}</span>
     </div>
</div>
</body>
</html>
<states>
     <state>
          <name>1</name>
     </state>
     <state>
          <name>2</name>
     </state>
     <state>
          <name>3</name>
     </state>
     <state>
          <name>4</name>
     </state>
     <state>
          <name>5</name>
     </state>
etc. etc.
</states>

The syntax for the xml file along with the rest of the source was provided in the original post. Here's the modified html file. How do I concactenate if (cat = 2) if (cat = 3) etc. into the function? Thanks in advance.
Also as you can see from my modified html source, I want two separate drop downs: one for MINage and one for MAx age. From looking at my provided source I have a feeling that when a user clicks on one or the other drop downs it will trigger the function for that selection and cancel the other filter out, which is undesired. So I am wondering how to have two drop downs work to filter between min and max age where if a user clicks on one drop down it doesn't cancel the function of the previous filter selection.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:spry="http://ns.adobe.com/spry">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Multiple Filters Sample</title>
<link href="http://labs.adobe.com/technologies/spry/css/samples.css" rel="stylesheet" type="text/css" />
<script language="JavaScript" type="text/javascript" src="http://labs.adobe.com/technologies/spry/includes/xpath.js"></script>
<script language="JavaScript" type="text/javascript" src="http://labs.adobe.com/technologies/spry/includes/SpryData.js"></script>
<script language="JavaScript" type="text/javascript" src="http://labs.adobe.com/technologies/spry/includes/SpryDataExtensions.js"></script>
<script type="text/javascript">

</script>
<style type="text/css">

</style>
</head>
<body>
<h3>Multiple Filters Sample</h3>
<div class="liveSample" style="float: left; margin-bottom: 4px;">
<form action="">
<select name="ageCat" onchange="MINage(this.value)">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
    <option value="9">9</option>
    <option value="10">10</option>
    <option value="11">11</option>
    <option value="12">12</option>
    <option value="13">13</option>
    <option value="14">14</option>
    <option value="15">15</option>
    <option value="16">16</option>
    <option value="17">17</option>
    <option value="18">18</option>
    <option value="19">19</option>
    <option value="20">20</option>
    <option value="21">21</option>
    <option value="22">22</option>
    <option value="23">23</option>
    <option value="24">24</option>
    <option value="25">25</option>
    <option value="26">26</option>
    <option value="27">27</option>
    <option value="28">28</option>
    <option value="29">29</option>
    <option value="30">30</option>
    <option value="31">31</option>
    <option value="32">32</option>
    <option value="33">33</option>
    <option value="34">34</option>
    <option value="35">35</option>
    <option value="36">36</option>
    <option value="37">37</option>
    <option value="38">38</option>
    <option value="39">39</option>
    <option value="40">40</option>
    <option value="41">41</option>
    <option value="42">42</option>
    <option value="43">43</option>
    <option value="44">44</option>
    <option value="45">45</option>
    <option value="46">46</option>
    <option value="47">47</option>
    <option value="48">48</option>
    <option value="49">49</option>
    <option value="50">50</option>
    <option value="51">51</option>
    <option value="52">52</option>
    <option value="53">53</option>
    <option value="54">54</option>
    <option value="55">55</option>
    <option value="56">56</option>
    <option value="57">57</option>
    <option value="58">58</option>
    <option value="59">59</option>
    <option value="60">60</option>
    <option value="61">61</option>
    <option value="62">62</option>
    <option value="63">63</option>
    <option value="64">64</option>
    <option value="65">65</option>
    <option value="66">66</option>
    <option value="67">67</option>
    <option value="68">68</option>
    <option value="69">69</option>
    <option value="70">70</option>
    <option value="71">71</option>
    <option value="72">72</option>
    <option value="73">73</option>
    <option value="74">74</option>
    <option value="75">75</option>
    <option value="76">76</option>
    <option value="77">77</option>
    <option value="78">78</option>
    <option value="79">79</option>
    <option value="80">80</option>
    <option value="81">81</option>
    <option value="82">82</option>
    <option value="83">83</option>
    <option value="84">84</option>
    <option value="85">85</option>
    <option value="86">86</option>
    <option value="87">87</option>
    <option value="88">88</option>
    <option value="89">89</option>
    <option value="90">90</option>
    <option value="91">91</option>
    <option value="92">92</option>
    <option value="93">93</option>
    <option value="94">94</option>
    <option value="95">95</option>
    <option value="96">96</option>
    <option value="97">97</option>
    <option value="98">98</option>
    <option value="99">99</option>
</select>
<select name="ageCat" onchange="MAXage(this.value)">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
    <option value="9">9</option>
    <option value="10">10</option>
    <option value="11">11</option>
    <option value="12">12</option>
    <option value="13">13</option>
    <option value="14">14</option>
    <option value="15">15</option>
    <option value="16">16</option>
    <option value="17">17</option>
    <option value="18">18</option>
    <option value="19">19</option>
    <option value="20">20</option>
    <option value="21">21</option>
    <option value="22">22</option>
    <option value="23">23</option>
    <option value="24">24</option>
    <option value="25">25</option>
    <option value="26">26</option>
    <option value="27">27</option>
    <option value="28">28</option>
    <option value="29">29</option>
    <option value="30">30</option>
    <option value="31">31</option>
    <option value="32">32</option>
    <option value="33">33</option>
    <option value="34">34</option>
    <option value="35">35</option>
    <option value="36">36</option>
    <option value="37">37</option>
    <option value="38">38</option>
    <option value="39">39</option>
    <option value="40">40</option>
    <option value="41">41</option>
    <option value="42">42</option>
    <option value="43">43</option>
    <option value="44">44</option>
    <option value="45">45</option>
    <option value="46">46</option>
    <option value="47">47</option>
    <option value="48">48</option>
    <option value="49">49</option>
    <option value="50">50</option>
    <option value="51">51</option>
    <option value="52">52</option>
    <option value="53">53</option>
    <option value="54">54</option>
    <option value="55">55</option>
    <option value="56">56</option>
    <option value="57">57</option>
    <option value="58">58</option>
    <option value="59">59</option>
    <option value="60">60</option>
    <option value="61">61</option>
    <option value="62">62</option>
    <option value="63">63</option>
    <option value="64">64</option>
    <option value="65">65</option>
    <option value="66">66</option>
    <option value="67">67</option>
    <option value="68">68</option>
    <option value="69">69</option>
    <option value="70">70</option>
    <option value="71">71</option>
    <option value="72">72</option>
    <option value="73">73</option>
    <option value="74">74</option>
    <option value="75">75</option>
    <option value="76">76</option>
    <option value="77">77</option>
    <option value="78">78</option>
    <option value="79">79</option>
    <option value="80">80</option>
    <option value="81">81</option>
    <option value="82">82</option>
    <option value="83">83</option>
    <option value="84">84</option>
    <option value="85">85</option>
    <option value="86">86</option>
    <option value="87">87</option>
    <option value="88">88</option>
    <option value="89">89</option>
    <option value="90">90</option>
    <option value="91">91</option>
    <option value="92">92</option>
    <option value="93">93</option>
    <option value="94">94</option>
    <option value="95">95</option>
    <option value="96">96</option>
    <option value="97">97</option>
    <option value="98">98</option>
    <option value="99">99</option>
</select>
     </form>
     <div spry:region="dsStates" spry:repeatchildren="dsStates">
          <span class="badge">{name}</span>
     </div>
</div>
<p><br style="clear: both;" />
</p>
</body>
</html>
Thanks!

HTML in a spry:content declaration?

Is it possible to put HTML tags into a spry:content
declaration? For example, I'd like to be able to do this:
<span spry:content="There are
<strong>{dsIssues::ds_RowCount}</strong> matching
Deals">
But the actual text "<strong>" and "</strong>" is
output instead of the desired formatting. I'm using the
spry:content tag to avoid the annoying flashing bug.
Thanks.

I was able to come up with a workaround for now, though it's
a bit more verbose that I'd like. I just put the non-dynamic text
outside of the spry:content span, like so:
There are <strong><span
spry:content="{dsIssues::ds_RowCount}"></span></strong> matching
Deals
Strangely, I had to put in the nbsp markers around it
because, in IE, the trailing text "matching.." was appearing
without a space between it and the ds_RowCount output. Strange bug.
Oh well, thanks anyway.

ERROR: spry:region or spry:detailregion attribute has no data set!

here's the basics...
i'm running fusebox for php (if that makes any difference)
i'm also reusing the same gallery for multiple fuseactions,
and using my circuit.xml file to set the var $gallery
depending on which fuseaction has been called.
the photos already exist in a database and full size and
thumbs have already been created by imagemagick
i plan on writing a script that uses imagemagick to get the
dimensions of the imagefiles and saves them to four respective new
columns in my db table (so i hope the problem isn't related to the
height attributes not being set in my xml.... let's hope it's
somthing else, ok?)
i'm creating my datasets like this
quote:
var dsGallery = new Spry.Data.XMLDataSet("/index.php",
"gallery", { method: "POST", postData: "do=m.get<?php echo
$gallery ?>Gallery", headers: { "Content-Type": "text/xml" });
var dsPhotos = new Spry.Data.XMLDataSet("/index.php",
"gallery/photos/photo", { method: "POST", postData:
"do=m.get<?php echo $gallery ?>Gallery", headers: {
"Content-Type": "text/xml"});
the output xml is perfect... here's an example
http://www.inkincnewyork.com/index.php?do=m.getFlashGallery
since i'm reusing the gallery, and have no need for the
dsGalleries related functionality i did this.
using the long way of referencing each piece of data, just to
make sure it's all kosher
quote:
<div id="thumbnails" spry:region="dsPhotos dsGallery">
<div spry:repeat="dsPhotos"
onclick="HandleThumbnailClick('{ds_RowID}');"
onmouseover="GrowThumbnail(this.firstChild,
'{dsPhoto::photo/@thumbwidth}', '{dsPhoto::photo/@thumbheight}');"
onmouseout="ShrinkThumbnail(this.firstChild);"><img
id="tn{ds_RowID}" alt="thumbnail for {dsPhoto::photo/@thumbpath}"
src="{dsGallery::thumbnail/@base}{dsPhoto::photo/@thumbpath}"
width="24" height="24" style="left: 0px; right: 0px;"
/></div>
<p class="ClearAll"></p>
</div>
but i am now getting this error
spry:region or spry:detailregion attribute has no data set!
for each XMLDataSet
anyone have any ideas?

A few things I noticed when looking at your sample source
above:
The "Content-Type" should be the type for the post data, not
what you expect to get back. So in your case, you should be using:
"Content-Type": "application/x-www-form-urlencoded";
which is the default type so you don't really have to pass it
to the constructor unless you are posting something other than that
type.
Next, your {ds_RowID} data references are missing the data
set prefix. If you use more than one data set for a given region,
you need to use the prefix to make sure you are getting the
ds_RowID from the correct data set.
The error: "spry:region or spry:detailregion attribute has no
data set!" tells me that the data sets are not defined at the time
Spry first processes the region. Are your data sets being created
in a script tag in the head? Or are you creating them in some
function that gets fired off at a specific time?
--== Kin ==--

Spry:Content and Dynamic Spry Data

Similar Messages

Maybe you are looking for