Spry In A Table

Hi I have a table with a Vertical Spry Menu inside of one of
the cells, when the amount of text in another bordering cell is
taller than the spry menu the spry menu moves down to the center of
the table. I was wondering if there was a way to make my menu
stationary at the top of the cell or have the menu move down as the
user scrolls down? Thank you, Ben Lahue.

thank you for your response, if you visit
L=http://lahue.ath.cx/Staff.html]http://lahue.ath.cx/Staff.html[/L]
it is running off of my home server so it will normally be up but
sometime not, i have a table and would like the spry menu to scroll
down the page as the user scrolls down or to be stationary at the
top
here is the code of my page if that will help:(there is a
large amount of text in the center column i had to omit)
<!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"><!--
InstanceBegin template="/Templates/Staff(new).dwt"
codeOutsideHTMLIsLocked="false" -->
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8" />
<!-- InstanceBeginEditable name="doctitle" -->
<title>Staff</title>
<!-- InstanceEndEditable -->
<style type="text/css">
<!--
.style10 {font-size: 48px;
font-weight: bold;
color: #660099;
.style12 {font-size: 24px;
font-weight: bold;
color: #660099;
.style13 {font-size: 36px}
.style14 {color: #660099;
font-weight: bold;
body {
background-color: #FFD700;
-->
</style>
<style>
<!--
body {
background-image: url(/pirate.gif);
background-repeat: no-repeat;
background-attachment: fixed;
background-position:center
//-->
</style>
<script src="SpryAssets/SpryMenuBar.js"
type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css"
rel="stylesheet" type="text/css" />
<link href="SpryAssets/SpryMenuBarVertical.css"
rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
.style20 {font-size: 100%}
-->
</style>
<!-- InstanceBeginEditable name="head" --><!--
InstanceEndEditable -->
</head>
<body>
<p align="center"><span class="style10">Alburnett
Community Schools</span></p>
<p align="center" class="style14"><span
class="style13">131 Roosevelt Street-Alburnett, Iowa
52341</span></p>
<p align="center" class="style12">Main Phone:
319-842-2263 Fax: 319-842-2398</p>
<ul id="MenuBar1" class="MenuBarHorizontal">
<li><a class="MenuBarHorizontal"
href="/Home.html">Home</a> </li>
<li><a
href="/Community/community.html">Community</a></li>
<li><a class="MenuBarHorizontal"
href="/District/District.html">District</a> </li>
<li><a
href="/Elementary/Elementary.html">Elementary</a></li>
<li><a href="/High School/highschool.html">High
School</a></li>
<li><a
href="/Staff.html">Staff</a></li>
</ul>
<table width="100%" height="253" border="1">
<tr>
<td width="auto"><!-- InstanceBeginEditable
name="EditRegion3" -->
<table border="0" cellspacing="1" cellpadding="0"
width="99%">
<tr>
<td width="48%"><p
align="center"><strong><u>Name</u></strong>
</p></td>
<td width="79%"><p
align="center"><strong><u>Position</u></strong>
</p></td>
<td width="49%"><p
align="center"><strong><u>E-mail</u></strong>
</p></td>
</tr>
</table>
<!-- InstanceEndEditable --></td>
<td width="165"><ul class="MenuBarVertical style20"
id="MenuBar11">
<li><a href="#">Quick Links</a></li>
<li><a href="mailto:[email protected]">Contact
Us</a></li>
<li><a href="
http://www.adobe.com/products/acrobat/readstep2.html?promoid=BONRM">Get
Adobe Reader</a></li>
<li><a href="
http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash&amp;pr omoid=BIOW&amp;promoid=BONRN"
class="MenuBarVertical">Get Flash Player</a> </li>
<li><a href="
http://www.microsoft.com/windows/downloads/ie/getitnow.mspx">Get
IE7</a></li>
<li><a href="
http://www.aea10.k12.ia.us/">Grant
Wood</a></li>
<li><a class="MenuBarVertical" href="
http://cp.alburnett.k12.ia.us/?login=1">SIPS</a>
</li>
<li><a href="
http://alburnett.k12.ia.us/Login.aspx?ReturnUrl=%2fDefault.aspx">Staff
Use E-Mail</a></li>
<li><a href="Home.html"
class="MenuBarVertical">Home</a> </li>
</ul></td>
</tr>
</table>
<p align="center"><span
class="style18">&copy;</span>2008 Alburnett Community
Schools-Site Built and Maintained by Ben Lahue Contact at <a
href="mailto:[email protected]">[email protected]</a></p>
<p> </p>
<p align="center" class="style12"> </p>
<script type="text/javascript">
<!--
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1",
{imgDown:"SpryAssets/SpryMenuBarDownHover.gif",
imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
var MenuBar11 = new Spry.Widget.MenuBar("MenuBar11",
{imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
//-->
</script>
</body>
<!-- InstanceEnd --></html>

Similar Messages

  • Spry for sorting tables tutorial

    I have a static table with 5 columns 10 rows and would like the user to be able to click anyone of the columns to get accending order or deccending order, to see how they rank as per column headings. I have looked at many javascript scripts, but did not work well or not what I wanted, so I thought why not spry. I looked at the spry samples on adobe site but there was no tutorials to go along with the sort table sample. If any one has a link or scripts for doing this I would be much appricated, Thx

    Hi,
    You are only seeing 15 rows as your table is not correct after entry 15. From row 16 onwards you need <td></td> for each column even if you have no entries to ensure the Spry HTML dataset picks up all the rows.
    Try the following on your site in same directory as your PHP page to see how it works on a simple page.  Change references to folders for SpryData and SpryHTMLDataSet as appropriate
    <!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>Sortable Table</title>
    <script src="SpryAssets/SpryData.js" type="text/javascript"></script>
    <script src="SpryAssets/SpryHTMLDataSet.js" type="text/javascript"></script>
    <script type="text/javascript">
    <!--
    var ds1 = new Spry.Data.HTMLDataSet("teamstats.php", "myTable");
    //-->
    </script>
    </head>
    <body>
    <div spry:region="ds1">
      <table>
        <tr>
          <th spry:sort="Team_Name">Team_Name</th>
          <th spry:sort="Points">Points</th>
          <th spry:sort="Wins">Wins</th>
          <th spry:sort="Poles">Poles</th>
          <th spry:sort="Top_5's">Top_5's</th>
          <th spry:sort="Top_10's">Top_10's</th>
        </tr>
        <tr spry:repeat="ds1">
          <td>{Team_Name}</td>
          <td>{Points}</td>
          <td>{Wins}</td>
          <td>{Poles}</td>
          <td>{ds1::Top_5's}</td>
          <td>{ds1::Top_10's}</td>
        </tr>
      </table>
    </div>
    </body>
    </html>
    Phil

  • Spry Menubar in table -problem in IE

    I'm a newbie to web design and this software...having said
    that here is my issue:
    I inserted a horizontal Spry menu bar in a cell of a table.
    When viewed in Firefox, all is well. When viewed in IE, the Spry
    menubar is no longer in the cell but dropped well below and to the
    right of the entire table.
    Any idea where to correct this?

    I'm a newbie to web design and this software...having said
    that here is my issue:
    I inserted a horizontal Spry menu bar in a cell of a table.
    When viewed in Firefox, all is well. When viewed in IE, the Spry
    menubar is no longer in the cell but dropped well below and to the
    right of the entire table.
    Any idea where to correct this?

  • Controlling spry menu inside tables

    I am trying to add a spry menu bar widget inside a table on my web page. The problem
    I am having is the spry menu floats and does not move with the table. Is there something
    I must do to nest the spry menu bar inside the table ?
    I tried inserting a div tag and then placeing the menu inside of that but the menu still
    floats above the table. Any help would be greatly apprieciated

    le chin wrote:
    My code is below. I am trying to insert spry menu bar inside table but for some reason the
    bar does not move with the table.
    <body>
    <table width="741" height="800" border="0" align="center">
    <tr>
      <td width="738" height="100" align="left"><table width="750" height="64" border="0">
        <tr>
          <td>
    <ul id="MenuBar1" class="MenuBarHorizontal">
    <li><a href="#">Item 1</a>          </li>
    <li><a href="#">Item 2</a></li>
    <li><a href="#">Item 3</a>          </li>
    <li><a href="#">Item 4</a></li>
    </ul>
    </td>
    </tr>
    </table></td>
    Why nested tables? What are you try to do? Centre the menu or have it aligned to the left?
    Steve

  • Spry Dataset (dynamic table) not displaying images

    Hi - new to Spry but loving it! I just did the tutorial for
    creating
    dynamic
    tables and had no problems outside of trying to get images to
    display in one tableset. in the XML I have
    <thumb><image href="imx/china.jpg"
    /></thumb>
    with thumb being the node name (naturally). the table cell
    displays nothing but all others have text displayed properly. is
    there no way of calling in images?
    Thanks for the help and advice!

    If you really want to embed HTML in XML, then read this
    sample:
    http://labs.adobe.com/technologies/spry/samples/data_region/HTMLFragsInXMLSample.html
    You can also just embed the path in the XML like this:
    <thumb>img/china.jpg</thumb>
    and then reference it in your region markup like this:
    <div spry:region="ds1">
    <img src="{thumb}" alt="{thumb}" />
    </div>

  • Controlling spry menu inside table

    My code is below. I am trying to insert spry menu bar inside table but for some reason the
    bar does not move with the table.
    <body>
    <table width="741" height="800" border="0" align="center">
    <tr>
      <td width="738" height="100" align="left"><table width="750" height="64" border="0">
        <tr>
          <td>
    <ul id="MenuBar1" class="MenuBarHorizontal">
    <li><a href="#">Item 1</a>          </li>
    <li><a href="#">Item 2</a></li>
    <li><a href="#">Item 3</a>          </li>
    <li><a href="#">Item 4</a></li>
    </ul>
    </td>
    </tr>
    </table></td>

    le chin wrote:
    My code is below. I am trying to insert spry menu bar inside table but for some reason the
    bar does not move with the table.
    <body>
    <table width="741" height="800" border="0" align="center">
    <tr>
      <td width="738" height="100" align="left"><table width="750" height="64" border="0">
        <tr>
          <td>
    <ul id="MenuBar1" class="MenuBarHorizontal">
    <li><a href="#">Item 1</a>          </li>
    <li><a href="#">Item 2</a></li>
    <li><a href="#">Item 3</a>          </li>
    <li><a href="#">Item 4</a></li>
    </ul>
    </td>
    </tr>
    </table></td>
    Why nested tables? What are you try to do? Centre the menu or have it aligned to the left?
    Steve

  • Limiting Items Displayed in Spry Repeat Lists, Tables, Etc.

    Is it possible to limit the items shown in Spry repeat
    region? For example say I have 20 items in a list and only want to
    display the first three items, not the entire list. If so how is
    that done?

    Hey Oscar,
    Glad that works for you.
    Kin and I were thinking that {ds_RowNumber} might be better
    for that particular looping, but you get the idea.
    http://labs.adobe.com/technologies/spry/articles/data_set_overview/index.html
    That was our first overview doc and it was definitive at the
    time. We no longer update it but it's a good intro to Spry.
    You can find the built in data references in that doc,
    granted almost at the very bottom.
    The API doc
    http://labs.adobe.com/technologies/spry/articles/data_api/index.html
    is a good start but we still have a lot to add to it. I have
    plans for it for sure.
    We are doing a big push for 1.6 towards progressive
    enhancement, unobtrusive js and things like that.
    Expect docs and samples and some cool utilities to come out
    this summer and for 1.6.
    And we won't charge for it, but we also won't return any
    cash-laden envelopes... ;)
    Let us know how to improve any part of Spry.
    Thanks,
    Don

  • How to open a new page from a Spry Table click, with element info?

    Hello, Spry experts!
    This is probably simple, but I've searched for hours and can't find what I need. I'm using Dreamweaver CS4 and Spry 1.6.1 to create a simple Spry Table from an XML data set using PHP as my back end.  I've used Dreamweaver's Insert->Spry->Spry Data Set to create everything, and the table is working fine.  Colors, clicks, sorts, etc., are all working correctly as expected.
    What I want is to be able to add a behavior such that when a table row is clicked, I can open a new page.  Moreover, I want to pass a parameter from the table to the new page, like http://www.mydomain.com/newpage.php?aid=12345 or whatever.
    So, for example, my table has two columns, "a_id" and "a_name", and my repeat region looks like this:
    <div spry:region="xml_assignments">
    <table width="500">
    <tr>
    <th spry:sort="a_id" class="spry_header">ID</th>
    <th spry:sort="a_name" class="spry_header">Assignment</th>
    </tr>
    <tr spry:repeat="xml_assignments" spry:setrow="xml_assignments" spry:odd="spry_odd" spry:even="spry_even" spry:hover="spry_hover" spry:select="spry_select">
    <td>{a_id}</td>
    <td>{a_name}</td>
    </tr>
    </table>
    </div>
    What I want is to be able to open an entirely new URL, passing the value of the {a_id} in the selected row as a parameter to the new URL, as in something like:  http://www.mydomain.com/newpage.php?aid={a_id}
    So my questions are: 
    1. How best to apply the action to the table?  Add an onclick to the tr tag?  Something else?
    2. How to extract the {a_id} value from the current row and pass it as a parameter to the action?
    Or maybe just take another approach entirely?
    I know that I can make the actual text in the table cells hyperlinks, and use them to link to the new page, which is fine.  The desire here is just to make it so that the user can click "anywhere" on the table row (as they can currently do with the spry:select behavior) and have the link kick off, whether they actually click on the linked text or somewhere in the row where there is no text.
    I'm sure this is obvious and simple, but I'm new to this level of Spry detail, and my brain is fried from hunting.  Any guidance will be gratefully appreciated!
    Glen Barney

    I found the answer myself, after posting this, of course!
    I changed:
    <tr spry:repeat="xml_assignments" spry:setrow="xml_assignments" spry:odd="spry_odd" spry:even="spry_even" spry:hover="spry_hover" spry:select="spry_select">
    to
    <tr spry:repeat="xml_assignments" spry:setrow="xml_assignments" spry:odd="spry_odd" spry:even="spry_even" spry:hover="spry_hover" spry:select="spry_select" onclick="window.location.href='./newpage.php?aid={a_id}';">
    Basically just added the onclick parameter...
    And it all just worked!

  • Build a table based on XML data set with Spry

    Hi there,
    I'm new to spry technology therefore forgive any basic question of mine.
    I'm trying to fill content in a table based on XML data set values but nothing is shown :-(
    here is my code.... any suggestion? pls tell me where I'm wrong.
    Thank you in advance
    <script src="SpryAssets/xpath.js" type="text/javascript"></script>
    <script src="SpryAssets/SpryData.js" type="text/javascript"></script>
    <script type="text/javascript">
    var uscite = new Spry.Data.XMLDataSet("data/Calendario 2011.xml", "csv_data_records/record", {sortOnLoad: "Date", sortOrderOnLoad: "ascending"});
    uscite.setColumnType("Date", "date");
    uscite.setColumnType("km", "number");
    </script>
    <div class="RankContainer" id="UsciteDiv" spry:region="uscite" >
              <table width="100%" border="0" class="RankTable">
                <tr>
                  <th width="10%" scope="col" spry:sort="Date">Data</th>
                  <th width="20%" scope="col">Destinazione</th>
                  <th width="5%" scope="col">KM</th>
                  <th width="35%" scope="col">Percorso</th>
                  <th width="30%" scope="col">Breve</th>
                 <!-- <th width="15%" scope="col">Mappa</th>-->
                </tr>
                <tr>
                   <script type="text/javascript">
           var rows = uscite.getData();
        for (var i = 0; i < rows.length; i++)
         if (rows[i]["Mappa"].startsWith("/"))
          rowContent = "<td> si </td>";
         else
              rowContent = "<td> no </td>";
         document.write("<td>{Date}</td>");
         document.write("<td>"+rowContent+"</td>");
         document.write("<td>{km}</td>");
         document.write("<td>{Percorso}</td>");
         document.write("<td>{Breve}</td>");
          </script>
               </tr>
              </table>
           </div>

    Sure this is how it should work (except that no anchor tag shall be present for Destinazione whereas Mappa has no real value in)
    http://www.gsc-borsano.it/_Calendario%202011.html
    and this is the non working page
    http://www.gsc-borsano.it/_v2Calendario%202011.html
    Thanks

  • How to Apply Style to a Spry Table?

    I am new to Spry. I am trying to apply some basic style(table width,row height) to a table created with a spry region.
    I have tried <table width="400px"> and <table style="width:400px;"> and these didn't work. I've tried creating  a class and <table class="xxxxx"> and that didn't work either. Also <tr height="12px"> as well as <tr style="height:12px;"> and <tr class="xxxx">. Am I missing something really obvious??

    <!DOCTYPE HTML>
    <html xmlns:spry="http://ns.adobe.com/spry">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Untitled Document</title>
    <style>
    #myTable {
        font-size: 0.8em;
        color: #333;
    #myTable .headrow {
        color: #FFF;
        background: #009;
        text-align: center;
        margin-bottom: 5px;
    #myTable .headrow th {
        font-size: 1.5em;
        font-weight: bold;
        padding: 2px 5px;
    #myTable td {
        line-height: 1.5em;
    #myTable th.lastname,
    #myTable th.firstname {
        width: 150px;
    </style>
    <script src="SpryAssets/xpath.js"></script>
    <script src="SpryAssets/SpryData.js"></script>
    <script>var ds1 = new Spry.Data.XMLDataSet("employees.xml", "employees/employee");</script>
    </head>
    <body>
    <div spry:region="ds1">
      <table id="myTable" cellpadding="0" cellspacing="0">
        <tr class="headrow">
          <th spry:sort="lastname" class="lastname">Lastname</th>
          <th spry:sort="firstname" class="firstname">Firstname</th>
          <th spry:sort="phone" class="phone">Phone</th>
          <th spry:sort="username" class="username">Username</th>
          <th spry:sort="@id" class="id">Id</th>
        </tr>
        <tr spry:repeat="ds1">
          <td>{lastname}</td>
          <td>{firstname}</td>
          <td>{phone}</td>
          <td>{username}</td>
          <td>{@id}</td>
        </tr>
      </table>
    </div>
    </body>
    </html>
    Have a look here for more info http://www.adobe.com/devnet/dreamweaver/css.html

  • Filter spry table from repeater list

    Using Dreamweaver, I am looking to find out how to link a
    spry repeat list (Select Drop-Down) to a Spry table.
    I have created a repeat list (Select Drop-Down) using a
    distinct filter on a field in my XML data base :
    The XML database is:
    var ds2 = new
    Spry.Data.XMLDataSet("Data/NetballDatafeed190401.xml",
    "NetballList/NetballProducts/SubType",{sortOnLoad:"SubType",sortOrderOnLoad:"as
    cending",distinctOnLoad:true});
    The drop down list is created by
    <div spry:region="ds2">
    <select name="select" spry:repeatchildren="ds2">
    <option value="{SubType}">{SubType}</option>
    </select>
    </div>
    I have a table which I want to show only the values on the
    table where the subType that matches the value from the select
    list.
    This data is populated by:
    var ds1 = new
    Spry.Data.XMLDataSet("Data/NetballDatafeed190401.xml",
    "NetballList/NetballProducts",{sortOnLoad:"ProductPrice",sortOr
    derOnLoad:"ascending"});
    and is created by
    div spry:region="ds1">
    <table>
    <tr>
    <th>ProductName</th>
    <th>ProductPrice</th>
    <th>ImageURL</th>
    <th>SubType</th>
    </tr>
    <tr spry:repeat="ds1">
    <td>{ProductName}</td>
    <td>{ProductPrice}</td>
    <td><img src="{ImageURL}"/></td>
    <td>{SubType}</td>
    </tr>
    </table>
    </div>
    I believe that I need to create a spry:Choose statement in
    the drop down list which runs a function that filters the DS1 XML
    data.
    I beleive that The function need to look like
    var myFilterFunc = function(dataSet, row, rowNumber)
    some funtion here that filters ds1 on {SubType}.......
    I will then need to run ds1.filter(myFilterFunc);
    Any pointers or examples most welcome.

    to do the the spry:if="'statement" needs to be in the
    <tr> rows you want to filter on

  • Ad link and image to spry dynamic table

    hello,
    i create a simple spry dynamic table i want to add a column
    with image (link to a photo gallery) and another one whose linking
    to pdf files. How i can do this.
    my html code:
    <!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>tableau choix séjour raquette: Bauges,
    Chartreuse</title>
    <style type="text/css">
    <!--
    .Style49 {color: #FF6600}
    -->
    </style>
    <script type="text/javascript"
    src="xpath.js"></script>
    <script type="text/javascript"
    src="SpryData.js"></script>
    <script type="text/javascript">
    var dsMassifs = new Spry.Data.XMLDataSet("tab_raquette.xml",
    "massifs/massif");
    </script>
    </head>
    <body>
    <div spry:region="dsMassifs">
    <table width="950" height="294" border="1"
    align="center">
    <tr>
    <th width="78" scope="col"spry:sort="@id"><div
    align="center" class="Style49">Massif</div></th>
    <th width="84"
    scope="col"spry:sort="durée"><div align="center"
    class="Style49">Durée</div></th>
    <th width="164"
    scope="col"spry:sort="thème"><div align="center"
    class="Style49">Thème</div></th>
    <th width="77" scope="col"spry:sort="niveau"><div
    align="left" class="Style49">Niveau</div></th>
    <th width="77" scope="col"spry:sort="niveau"><div
    align="center">Fichiers</div></th>
    </tr>
    <tr spry:repeat="dsMassifs">
    <td><div
    align="center">{@id}</div></td>
    <td><div
    align="center">{durée}</div></td>
    <td><div
    align="center">{thème}</div></td>
    <td><div
    align="left">{niveau}</div></td>
    <td><div
    align="left">{fichier}</div></td> </tr>
    </table>
    </div>
    </body>
    </html>
    my xml code:
    <?xml version="1.0" encoding="utf-8"?>
    <massifs xmlns="
    http://www.foo.com/employees">
    <massif id="Bauges">
    <durée>Week end</durée>
    <thème>raquette et bien
    être</thème>
    <niveau>1</niveau>
    <fichier>Fiche circuit.pdf</fichier>
    </massif>
    <massif id="Chartreuse">
    <durée>4 jours</durée>
    <thème>raquette et gastronomie
    </thème>
    <niveau>2</niveau>
    <fichier>Fiche circuit.pdf</fichier>
    </massif>
    </massifs>

    "David Powers" <[email protected]> wrote in message
    news:fapkm4$cjt$[email protected]..
    > Joris van Lier wrote:
    >> Does Dreamweaver CS3 contain such a "Live Object"?
    >> (one that generates XML export and Spry DynamicTable
    code from a
    >> Recordset?)
    >
    > One of the registration gifts for CS3 is an XML Export
    extension, which
    > generates XML on the fly from a recordset.
    Thanks for you reply David,
    since I posted I've found the the Spry documentation for
    Dreamweaver 9, and
    the info at
    http://livedocs.adobe.com/en_US/Dreamweaver/9.0/help.html?content=WS48C07A61-5107-48d0-AC6 2-D96B7A008F01.html,
    seems to suggest that inserting a spry DynamicTable is a
    multi step process,
    so the Live Object may still be useful in other servermodels,
    but I'll focus
    my efforts on duplicating the existing Spry integration for
    the PHAkt
    servermodel.
    Joris

  • Spry Table Customization

    Hi, I need to be able to indicate certain things in a Spry
    table. For example, I have a list of invoices, which the user can
    click and see the details of.
    The invoices are in several different states, depending. If
    it's "outstanding", I'd like it to be black. If it's "in arrears",
    I'd like to mark it red. That kind of thing.
    Maybe a different background color would be good. I'm not
    sure.
    Is there any way to do that with Spry Tables?
    Thanks,
    Neil Alexander

    I think you want something more like this:
    <div spry:region="dsCustomerOrderLineItems">
    <table width="100%" style="font-size:12px">
    <tr>
    <th width="20%">Item</th>
    <th width="40%">Desc</th>
    <th width="20%">Price</th>
    <th width="20%">Qty</th>
    </tr>
    <tbody spry:repeatchildren="dsCustomerOrderLineItems"
    spry:choose="choose">
    <tr spry:when="'{OrderLineItems_fCredit_Code}' != '0'"
    class="rowCredit" >
    <td>{Items_fCode}</td>
    <td>{Items_fDescription}</td>
    <td>{OrderLineItems_fPrice}</td>
    <td>{OrderLineItems_fQuantity}</td>
    </tr>
    <tr spry:default="default">
    <td>{Items_fCode}</td>
    <td>{Items_fDescription}</td>
    <td>{OrderLineItems_fPrice}</td>
    <td>{OrderLineItems_fQuantity}</td>
    </tr>
    </tbody>
    </table>
    </div>
    If you add more conditionals, you'll want to duplicate the
    <tr> with the spry:when on it and modify its expression to do
    whatever comparison you need to, and modify the class name it uses.
    --== Kin ==--

  • Spry:selected?  First choice in table selected

    Hi all:
    I want the first item in my table to be highlighted when
    enters the page. I understand that spry:selected may be able to do
    this, but when I include in my code, it always highlights the last
    item in the table list, not the first.
    Here is my code for the table as it currently stands.
    <div spry:region="ds1">
    <table>
    <tr spry:repeat="ds1" spry:setrow="ds1"
    spry:hover="hover" spry:select="select" spry:selected = "">
    <td>{select}</td>
    </tr>
    </table>
    </div>
    Thanks,
    oldmanscully

    Hi oldmanscully,
    I had the same problem and found the following solution. Hope
    it helps.
    <div spry:region="ds1">
    <table>
    <tr spry:repeat="ds1" spry:choose="">
    <td spry:when="{ds_CurrentRowID} == {ds_RowID}"
    spry:setrow="ds1" spry:hover="hover" spry:select="select"
    spry:selected="">{select}</td>
    <td spry:default="" spry:setrow="ds1"
    spry:hover="hover_row" spry:select="select"
    class="grid_row">{select}</td>
    </tr>
    </table>
    </div>
    Kind regards,
    Ben

  • Populating Spry Table using button action and Nested XML

    Ah, yet another question.
    So I have a catalog page with a Spry repeating table. The XML
    has 2 sets of nodes -- one for outfits and one for line sheets (the
    technical drawings for clothes). What i want to do is have the
    outfits show and populate the table to start off with, but
    re-populate with the line sheet info if a user clicks on a button.
    currently the page is set up and works perfectly by sucking
    in the XML and populating the table. What I can't seem to do is get
    the button (when clicked) to switch the outfit info with the line
    sheet info.
    I have the following
    // javascript:
    var siracusafall08 = new
    Spry.Data.XMLDataSet("fall_collection.xml",
    "collection/siracusa/outfits", { filterFunc: MyPagingFunc });
    var siracusaLS = new
    Spry.Data.NestedXMLDataSet(siracusafall08, "linesheet",
    {filterFunc:MyPagingFunc });
    siracusafall08.setColumnType("photoURL", "image");
    siracusafall08.setColumnType("lrgphoto", "image");
    var pageOffset = 0;
    var pageSize = 1;
    var pageStop = pageOffset + pageSize;
    //var dssiracusafall08 = new
    Spry.Data.XMLDataSet("fall_collection.xml", "collection/outfits", {
    filterFunc: MyPagingFunc });
    function MyPagingFunc(ds, row, rowNumber)
    if (rowNumber < pageOffset || rowNumber >= pageStop)
    return null;
    return row;
    function chooseLS()
    // no idea what to put here...
    function UpdatePage(offset)
    var numRows = siracusafall08.getUnfilteredData().length;
    if (offset > (numRows - pageSize))
    offset = numRows - pageSize;
    if (offset < 0)
    offset = 0;
    pageOffset = offset;
    pageStop = offset + pageSize;
    // Re-apply our non-destructive filter on dsStates1:
    siracusafall08.filter(MyPagingFunc);
    html
    <div spry:region="siracusafall08">
    <table>
    <tr spry:repeatchildren="siracusafall08">
    <td valign="top">{name}<br />{desc}</td>
    <td rowspan="8" valign="top" width="300"><img
    src="imx/{photoURL}"/></td>
    </tr>
    <tr spry:repeatchildren="siracusafall08">
    <td valign="top">{SKU1}<br />{SKU2}<br
    />{SKU3}</td>
    </tr>
    <tr spry:repeatchildren="siracusafall08">
    <td valign="top"><a href="imx/{lrgphoto}"
    target="_blank">enlarge</a></td>
    </tr>
    <tr spry:repeatchildren="siracusafall08">
    <td valign="top"><input type="image"
    src="../../imx/back.gif" onclick="UpdatePage(pageOffset -
    pageSize);" />
    <input type="image" src="../../imx/next.gif"
    onclick="UpdatePage(pageOffset + pageSize);" /><br
    /><br /><input type="button" value="filter"
    onclick="chooseLS();" /></td>
    </tr>
    <tr>
    <td height="200"> </td>
    </tr>
    </table>
    </div>
    XML
    <collection>
    <siracusa>
    <outfits>
    <photoURL>6648sm.jpg</photoURL>
    <lrgphoto>6648lg.jpg</lrgphoto>
    <SKU1>JS271SM</SKU1>
    <SKU2>PN109SM</SKU2>
    <SKU3></SKU3>
    <name>Siracusa Micro Crepe</name>
    <desc>Chestnut, Moss, Redwood, Black</desc>
    </outfits>
    <outfits>
    <photoURL>5237sm.jpg</photoURL>
    <lrgphoto>5237lg.jpg</lrgphoto>
    <SKU1>JS272SM</SKU1>
    <SKU2>LTK121SM</SKU2>
    <SKU3>PW112SM</SKU3>
    <name>Siracusa Micro Crepe</name>
    <desc>Chestnut, Moss, Redwood, Black</desc>
    </outfits>
    <outfits>
    <photoURL>5540sm.jpg</photoURL>
    <lrgphoto>5540lg.jpg</lrgphoto>
    <SKU1>JS272SM</SKU1>
    <SKU2>LTK121SM</SKU2>
    <SKU3>PW112SM</SKU3>
    <name>Siracusa Micro Crepe</name>
    <desc>Chestnut, Moss, Redwood, Black</desc>
    </outfits>
    <outfits>
    <photoURL>6276sm.jpg</photoURL>
    <lrgphoto>6276lg.jpg</lrgphoto>
    <SKU1>JL258SM</SKU1>
    <SKU2>PN100SM</SKU2>
    <SKU3></SKU3>
    <name>Siracusa Micro Crepe</name>
    <desc>Chestnut, Moss, Redwood, Black</desc>
    </outfits>
    <linesheet>
    <photoURL>5540sm.jpg</photoURL>
    <lrgphoto>5540lg.jpg</lrgphoto>
    <SKU1>JS128SM</SKU1>
    <SKU2>Mandarin collar jacket with box pleat
    cuff</SKU2>
    <SKU3>XS-XL</SKU3>
    <name>Siracusa Micro Crepe</name>
    <desc>Chestnut, Moss, Redwood, Black</desc>
    </linesheet>
    </siracusa>
    </collection>
    There's nothing in the documentation about using a button to
    repopulate a table. the Nested XML Data Sample page in the Spry
    documentation has been helpful in the past however this is more of
    a switch / toggle situation and frankly that kind of coding is a
    bit beyond my fine arts-trained skills.
    Any suggestions are greatly appreciated!

    Hi Bit Crusher,
    Sorry for the delayed response ...
    Looking at your setup, you can get rid of most of the code in
    collection.js since you are using a pageSize of 1 ... if displaying
    only one row of a data set is all you ever need, then you can get
    the equivalent functionality by just using a spry:detailregion and
    a couple of prev()/next() functions. For example:
    <script type="text/javascript">
    var siracusafall08 = new
    Spry.Data.XMLDataSet("fall_collection.xml",
    "collection/siracusa/outfits");
    siracusafall08.setColumnType("photoURL", "image");
    siracusafall08.setColumnType("lrgphoto", "image");
    var crepesfall08 = new
    Spry.Data.XMLDataSet("fall_collection.xml",
    "collection/crepes/outfits");
    crepesfall08.setColumnType("photoURL", "image");
    crepesfall08.setColumnType("lrgphoto", "image");
    function DSPrev(ds)
    var curRowNum = ds.getCurrentRowNumber();
    if (--curRowNum >= 0)
    ds.setCurrentRowNumber(curRowNum);
    function DSNext(ds)
    var curRowNum = ds.getCurrentRowNumber();
    if (++curRowNum < ds.getRowCount())
    ds.setCurrentRowNumber(curRowNum);
    </script>
    <div spry:detailregion="siracusafall08">
    </div>
    <div spry:detailregion="crepesfall08">
    </div>
    After you've simplified all that, the next thing I would do
    to get your linesheet switching working is to use "states". Take a
    look at these samples:
    http://labs.adobe.com/technologies/spry/samples/data_region/RegionStatesSample.html
    http://labs.adobe.com/technologies/spry/samples/data_region/StateMappingSample.html
    The first link is some basic background on states, but what
    should be of interest to you is the 2nd sample. What I would do is
    have a "styles" and a "linesheet" state in my region.
    Also since you are using nested XML data, you will need to
    access your <linesheet> data with a NestedXMLDataSet:
    http://labs.adobe.com/technologies/spry/samples/data_region/NestedXMLDataSample.html#Using NestedDataSets
    http://labs.adobe.com/technologies/spry/samples/data_region/NestedDataSample.html
    --== Kin ==--

Maybe you are looking for