Professional Web Applications Themes

Using spry to create multiple areas of data - Macromedia Dynamic HTML

Okay, I have been working on this for days. Basically, I have a list of cities in my spry master region and when the client clicks on the city name I need the information for each of the stores of that city to be displayed in my detail region. The trouble I am having is that some cities have only one store and others have up to 13. For each store I need a picture, the address, and a link to Google maps. Here is a snippet from the XML code that I am using to carry the data: <city> ...

  1. #1

    Default Using spry to create multiple areas of data

    Okay, I have been working on this for days. Basically, I have a list of cities
    in my spry master region and when the client clicks on the city name I need the
    information for each of the stores of that city to be displayed in my detail
    region. The trouble I am having is that some cities have only one store and
    others have up to 13.

    For each store I need a picture, the address, and a link to Google maps. Here
    is a snippet from the XML code that I am using to carry the data:

    <city>
    <name>BATESBURG </name>
    <store>
    <storeName># </storeName>
    <address><![CDATA[100 Columbia Ave.<br /> Batesburg, SC 29070<br />
    (803) 532-2956<br /> ]]> </address>
    <googleMap> </googleMap>
    <storeFront>Resized stores/Corner Pantry 147 - Batesburg.jpg
    </storeFront>
    </store>

    <store>
    <storeName>#138 </storeName>
    <address><![CDATA[344 Sumter Highway<br /> Camden, SC 29020<br />
    (803) 432-6877<br /> ]]> </address>
    <googleMap>
    http://maps.google.com/maps?oi=map&amp;q=344+Sumter+Highway,+Camden ,+SC+29020
    </googleMap>
    <storeFront> </storeFront>
    </store>
    </city>

    Is there a way to have AJAX create the table or div regions with the
    information?


    Tucker Guest

  2. #2

    Default Re: Using spry to create multiple areas of data

    You could add the city node to each store in the city, then make two datasets,
    with the second being the detail region, and then add an observer to the first
    to set your xpath for the details ds based on the city you select in a menu or
    click on from a link, here is some code tha is three datasets all linked with
    observers

    var xmlstr = '<?PHP echo $xmlString; ?>';

    var dsFiles = new Spry.Data.XMLDataSet(null, "statement_files/statement");
    dsFiles.setDataFromDoc(Spry.Utils.stringToXMLDoc(x mlstr));

    var dsDescriptions = new Spry.Data.XMLDataSet('{dsFiles::file_Name}',
    "bank_account/a_transaction/tran_desc",{sortOnLoad:"tran_desc",sortOrderOnLoad :"
    ascending",distinctOnLoad:true,useCache:false});

    var dsTransactions = new Spry.Data.XMLDataSet(null,
    "bank_account/a_transaction[tran_desc = '{dsDescriptions::tran_desc}']",{
    useCache:false });

    function updateTransactions(notificationType, notifier, data)
    {
    if (notificationType != "onPostLoad" && notificationType !=
    "onCurrentRowChanged")
    return;
    var doc = dsDescriptions.getDoent();
    if (doc)
    dsTransactions.setDataFromDoc(doc);
    };

    function updateDescriptions(notificationType, notifier, data)
    {
    if (notificationType != "onPostLoad" && notificationType !=
    "onCurrentRowChanged")
    return;
    var doc = dsFiles.getDoent();
    if (doc)
    dsDescriptions.setDataFromDoc(doc);
    };

    Notice the observers that will update the child dataset when the parent is
    changed, here is the select menus

    <div spry:region="dsFiles" style="float:left; margin-left:2em;">
    <select name="select2" spry:repeatchildren="dsFiles"
    onchange="dsFiles.setCurrentRowNumber(this.selecte dIndex);">
    <option spry:if="{ds_RowNumber} == {ds_CurrentRowNumber}"
    selected="selected">{statement_Month}</option>
    <option spry:if="{ds_RowNumber} != {ds_CurrentRowNumber}"
    value="{file_Name}">{statement_Month}</option>
    </select>
    </div>

    <div spry:region="dsDescriptions" style="float:left; margin-left:6em;">
    <select name="select" spry:repeatchildren="dsDescriptions"
    onchange="dsDescriptions.setCurrentRowNumber(this. selectedIndex);" >
    <option spry:if="{ds_RowNumber} == {ds_CurrentRowNumber}"
    selected="selected">{tran_desc}</option>
    <option spry:if="{ds_RowNumber} != {ds_CurrentRowNumber}"
    value="{tran_desc}">{tran_desc}</option>
    </select>

    Look at this link, try the Dataset Master Detail link
    http://labs.adobe.com/technologies/spry/samples/
    or the Spry Forum

    http://www.adobe.com/cfusion/webforums/forum/categories.cfm?forumid=72&catid=602

    MikeL7 Guest

  3. #3

    Default Re: Using spry to create multiple areas of data

    Useful information but IE6 may generate some error with it.
    yupieyi Guest

  4. #4

    Default Re: Using spry to create multiple areas of data

    Actually the above code works on Win 2k(IE5.5, 6) XP(IE6 & 7) and Vista(IE7),
    Firefox and Opera. And i have used the pages everyday for the last 7 months on
    6 different machines(work, laptops, home desktops). What part looks like it
    will throw errors?

    MikeL7 Guest

  5. #5

    Default Re: Using spry to create multiple areas of data

    [q]Originally posted by: MikeL7
    You could add the city node to each store in the city, then make two datasets,
    with the second being the detail region, and then add an observer to the first
    to set your xpath for the details ds based on the city you select in a menu or
    click on from a link, here is some code that is three datasets all linked with
    observers

    var xmlstr = '<?PHP echo $xmlString; ?>';

    var dsFiles = new Spry.Data.XMLDataSet(null, "statement_files/statement");
    dsFiles.setDataFromDoc(Spry.Utils.stringToXMLDoc(x mlstr));

    var dsDescriptions = new Spry.Data.XMLDataSet('{dsFiles::file_Name}',
    "bank_account/a_transaction/tran_desc",{sortOnLoad:"tran_desc",sortOrderOnLoad :"
    ascending",distinctOnLoad:true,useCache:false});

    var dsTransactions = new Spry.Data.XMLDataSet(null,
    "bank_account/a_transaction[tran_desc = '{dsDescriptions::tran_desc}']",{
    useCache:false });

    function updateTransactions(notificationType, notifier, data)
    {
    if (notificationType != "onPostLoad" && notificationType !=
    "onCurrentRowChanged")
    return;
    var doc = dsDescriptions.getDoent();
    if (doc)
    dsTransactions.setDataFromDoc(doc);
    };

    function updateDescriptions(notificationType, notifier, data)
    {
    if (notificationType != "onPostLoad" && notificationType !=
    "onCurrentRowChanged")
    return;
    var doc = dsFiles.getDoent();
    if (doc)
    dsDescriptions.setDataFromDoc(doc);
    };

    Thanks very much for the help. But I do not quit know enough to use it yet.
    Where do you add the scripting code, inside the <head> section?

    I am not familiar with the these terms yet, but what do you mean by an
    observer and what is the xpath?

    And what is the PHP code for and how does that tie in?


    Tucker Guest

  6. #6

    Default Re: Using spry to create multiple areas of data

    Where do you add the scripting code, inside the <head> section?
    ---Yes add the code in the head of the page.

    I am not familiar with the these terms yet, but what do you mean by an
    observer and what is the xpath?
    --An observer is a function that will 'listen' for the current row in one
    dataset to change that will determine the xpath or filtering of a second data
    set.
    --XPath is a language for finding information in an XML doent. XPath is
    used to navigate through elements and attributes in an XML doent.
    http://www.w3schools.com/XPath/default.asp
    And what is the PHP code for and how does that tie in?
    ---That php is actually a directory listing of xml files that can be read, the
    xml string is loaded into a Spry dataset with the
    dsFiles.setDataFromDoc(Spry.Utils.stringToXMLDoc(x mlstr)); function.

    Spend some time looking at the spry sample page link in the original post.
    Experiment with two simple datasets and set up one that filters the second

    MikeL7 Guest

Similar Threads

  1. Spry Data Set
    By Lukelaw in forum Macromedia Exchange Dreamweaver Extensions
    Replies: 1
    Last Post: July 2nd, 09:12 PM
  2. Multiple Spry Menu Bars
    By ratherbefishin in forum Macromedia Exchange Dreamweaver Extensions
    Replies: 2
    Last Post: December 4th, 08:50 AM
  3. Multiple Spry Textfield Form Errors
    By Nathan77777 in forum Macromedia Exchange Dreamweaver Extensions
    Replies: 0
    Last Post: October 25th, 04:44 AM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139