Multiple lists to go through

Discussion in 'Javascript' started by Brie, Mar 15, 2006.

  1. Brie

    Brie Guest

    I'm trying to do a sort on our intranets portal. I'm not sure if
    anyone has experience with this, but it uses javascript. I pulls a
    selection list and has a sort menu on the left and then displays the
    results on the left. I'm trying to sort through three selection lists.
    Is there a way to set this up so it goes through all three selection
    lists using javascript? I've put my code below.

    Thanks,
    Brie

    <html>
    <head>

    <title><pcs:value expr="encode(folder.name)"></pcs:value></title>

    <script>
    function open_article<pcs:value expr="pcs_id"></pcs:value>(url) {
    newWindow = window.open(url, 'article_pop_<pcs:value
    expr="list.pcs_id"></pcs:value>',
    'toolbar=no,location=no,scrollbars=yes,resizable=yes,width=500,height=350');
    newWindow.focus();
    }


    var strOnColor = "#FFFFFF"; // menu hover color
    var strOffColor = "#E9E9E9"; // menu default color
    var strSelColor = "#9E9E9E"; // menu selected color

    var strOnFontColor = "#000000"; // menu font hover color
    var strOffFontColor = "#000000"; // menu font default color
    var strSelFontColor = "#000000"; // menu font selected color

    //PLEASE NOTE: YOU WILL HAVE TO SET THIS ACCORDING TO A <contentid>
    (SEE BELOW)
    var itmCurrent = "listall"; // default item selected

    // highlights menu selections on left table
    function menuHighlight(tdMenu, strColor, strFont) {
    document.getElementById(tdMenu).bgColor = strColor;
    document.getElementById(tdMenu).style.color = strFont;
    }

    // shows appropriate content on right div
    function contentShow(divShow, divContent) {
    document.getElementById(divShow).innerHTML =
    document.getElementById(divContent).innerHTML;
    }

    // handles hovering based on if strOn is "on" or "off"
    function menuHover(mnuObj, itmHover, strOn) {
    if (strOn == "on") {
    menuHighlight("td"+itmHover, strOnColor, strOnFontColor);
    mnuObj.style.cursor='hand';
    //contentShow("divShow", "div"+itmHover);
    } else {
    if (itmHover == itmCurrent) {
    menuHighlight("td"+itmHover, strSelColor, strSelFontColor);
    } else {
    menuHighlight("td"+itmHover, strOffColor, strOffFontColor);
    }
    mnuObj.style.cursor='pointer';
    //contentShow("divShow", "div"+itmCurrent);
    }
    }

    // unselects old item and then selects new menu item
    function menuSelect(itmSelect) {
    menuHighlight("td"+itmCurrent, strOffColor, strOffFontColor);

    itmCurrent = itmSelect;
    menuHighlight("td"+itmSelect, strSelColor, strSelFontColor);
    contentShow("divShow", "div"+itmSelect);
    }

    </script>

    <pt:styleSheets xmlns:pt='http://www.plumtree.com/xmlschemas/ptui/'/>
    </head>

    <body marginwidth="0" marginheight="0" leftmargin="0" topmargin="0">

    <table width="100%" border="0" cellpadding="0" cellspacing="0"
    bordercolor="#FFFFFF" bgcolor="#FFFFFF">
    <tr>
    <td width="200px" valign="top">

    <!-- left nav banner -->

    <table width="125px" border="0" cellpadding="0" cellspacing="2"
    bordercolor="#FFFFFF" bgcolor="#FFFFFF">
    <tr>
    <td height="20" bgcolor="#BDDDFB"><strong>
    <font size="2" face="Verdana, Arial, Helvetica, sans-serif"
    color="#000000">&nbsp;Sort by City:</font></strong></td>
    </tr>

    <!-- left nav menu -->

    <tr>
    <td id="tdlistall" height="18" bgcolor="#E9E9E9"" height="18"
    bgcolor="#E9E9E9"
    onClick="menuSelect('listall');"
    onMouseOver="menuHover(this, 'listall', 'on');"
    onMouseOut="menuHover(this, 'listall',
    'off');"><strong>&nbsp;
    Full Listing</strong></td>
    </tr>


    <pcs:foreach var="city" listexpr="CityList">

    <tr>
    <td id="td<pcs:value expr="city_position"></pcs:value>"
    height="18" bgcolor="#E9E9E9"" height="18" bgcolor="#E9E9E9"
    onClick="menuSelect('<pcs:value
    expr="city_position"></pcs:value>');"
    onMouseOver="menuHover(this, '<pcs:value
    expr="city_position"></pcs:value>', 'on');"
    onMouseOut="menuHover(this, '<pcs:value
    expr="city_position"></pcs:value>', 'off');"><strong>&nbsp;
    <pcs:value expr="city"></pcs:value></strong>
    [<pcs:value expr=" filter(items, 'filtered.city==city
    &and;filtered.published &and;
    !filtered.hidden').length"></pcs:value>]</td>

    </tr>



    </pcs:foreach>



    </table>
    </td>






    <td width="100%" valign="top">

    <!-- right content -->

    <div id="divShow" style="margin: 2px"></div>

    <!-- source code list -->

    <!-- PLEASE NOTE: FIGURE OUT A WAY TO GIVE A UNIQUE ID NAME FOR THE DIV
    HERE PER city
    <contentid> SHOULD MATCH <menuid> (SEE BELOW)
    YOU SHOULD HAVE 1 DIV HERE PER city -->

    <div id="divlistall" style="margin:2px; visibility:hidden;
    height:1px; overflow:hidden;">
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr class="banHeaderBg">
    <td height="20" bgcolor="#BDDDFB">
    <div align="center"><strong> <font color="#000000"
    size="2" face="Verdana, Arial, Helvetica, sans-serif">Training
    Presentations </font></strong></div></td>
    </tr>
    </table>

    <table width="100%" border="0" cellpadding="0" cellspacing="10"
    bgcolor="#FFFFFF">
    <!-- <tr bgcolor="#FFFFFF">
    <td height="18" colspan="4" class="listSubtitle">
    <div align="center"><font color="#000000"><strong>Full
    Listing (in alphabetical order)</strong></font></div></td>
    </tr>-->

    <tr>
    <td width="100%" valign="top">

    <div style="margin:0px; height:100%; width:100%;
    overflow:auto;">
    <table width="100%" border="1" cellpadding="2"
    cellspacing="0" bordercolor="#BDDDFB">
    <tr bgcolor="#CCCCCC">
    <td height="18">
    <div align="center"><strong> <font size="1"
    color="#000000" face="Verdana, Arial, Helvetica, sans-serif">Name
    of Training</font></strong></div></td>
    <td class="listSubtitle">
    <div align="center"><strong>
    <font size="1" color="#000000" face="Verdana,
    Arial, Helvetica, sans-serif">Type</font></strong></div></td>
    <td class="listSubtitle">
    <div align="center"><strong>
    <font size="1" color="#000000" face="Verdana,
    Arial, Helvetica, sans-serif">Level</font></strong></div></td>
    <td class="listSubtitle">
    <div align="center"><strong>
    <font size="1" color="#000000" face="Verdana,
    Arial, Helvetica, sans-serif">Date</font></strong></div></td>
    </tr>

    <pcs:foreach var="item" expr="filter(sort(items, 'item.Name',true),
    'filtered.published &and; !filtered.hidden')">

    <tr bgcolor="#FFFFFF">
    <td width="25%" height="30" class="listSubtitle">
    <a href="#" onClick="open_article<pcs:value
    expr="pcs_id"></pcs:value>('<pcs:value
    expr='item.location'></pcs:value>'); return false;"><pcs:value
    expr="encode(item.Name)"></pcs:value></a><br>
    <span class="listText"><pcs:value
    expr="encode(item.abstract)"></pcs:value></span>
    </td>
    <td width="25%">
    <div align="center"><pcs:value
    expr="encode(item.type)"></pcs:value></div></td>
    <td width="25%">
    <div align="center"><pcs:value
    expr="encode(item.level)"></pcs:value></div></td>
    <td width="25%">
    <div align="center"><pcs:value expr="item.date"
    format="MMMM d, yyyy"></pcs:value></div></td>
    </tr>

    </pcs:foreach>
    </table>
    </div>
    </td>
    </tr>
    </table>
    </div>


    <pcs:foreach var="city" listexpr="CityList">

    <div id="div<pcs:value expr="city_position"></pcs:value>"
    style="margin:2px; visibility:hidden; height:1px; overflow:hidden;">
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr class="banHeaderBg">
    <td height="20" bgcolor="#BDDDFB">
    <div align="center"><strong> <font color="#000000"
    size="2" face="Verdana, Arial, Helvetica, sans-serif">Training
    Presentations</font></strong></div></td>
    </tr>
    </table>

    <table width="100%" border="0" cellpadding="0" cellspacing="10"
    bgcolor="#FFFFFF">
    <!-- <tr bgcolor="#FFFFFF">
    <td height="18" colspan="4" class="listSubtitle">
    <div align="center"><font
    color="#000000"><strong><pcs:value
    expr="city"></pcs:value></strong></font></div></td>
    </tr>-->

    <tr>
    <td width="100%" valign="top">
    <div style="margin:0px; height:100%; width:100%;
    overflow:auto;">
    <table width="100%" border="1" cellpadding="2"
    cellspacing="0" bordercolor="#BDDDFB">
    <tr bgcolor="#CCCCCC">
    <td height="18">
    <div align="center"><strong> <font size="1"
    color="#000000" face="Verdana, Arial, Helvetica, sans-serif">Name
    of Training</font></strong></div></td>
    <td class="listSubtitle">
    <div align="center"><strong>
    <font size="1" color="#000000" face="Verdana,
    Arial, Helvetica, sans-serif">Type</font></strong></div></td>
    <td class="listSubtitle">
    <div align="center"><strong>
    <font size="1" color="#000000" face="Verdana,
    Arial, Helvetica, sans-serif">Level</font></strong></div></td>
    <td class="listSubtitle">
    <div align="center"><strong>
    <font size="1" color="#000000" face="Verdana,
    Arial, Helvetica, sans-serif">Date</font></strong></div></td>
    </tr>

    <pcs:foreach var="item" expr="filter(sort(items, 'item.Name',true),
    'filtered.published &and; !filtered.hidden')">
    <pcs:if expr="item.city==city">

    <tr bgcolor="#FFFFFF">
    <td width="25%" height="30" class="listSubtitle">
    <a href="#" onClick="open_article<pcs:value
    expr="pcs_id"></pcs:value>('<pcs:value
    expr='item.location'></pcs:value>'); return false;"><pcs:value
    expr="encode(item.Name)"></pcs:value></a><br>
    <span class="listText"><pcs:value
    expr="encode(item.abstract)"></pcs:value></span>
    </td>
    <td width="25%">
    <div align="center"><pcs:value
    expr="encode(item.type)"></pcs:value></div></td>
    <td width="25%">
    <div align="center"><pcs:value
    expr="encode(item.level)"></pcs:value></div></td>
    <td width="25%">
    <div align="center"><pcs:value expr="item.date"
    format="MMMM d, yyyy"></pcs:value></div></td>
    </tr>

    </pcs:if>
    </pcs:foreach>
    </table>
    </div>
    </td>
    </tr>
    </table>
    </div>
    </pcs:foreach>

    </td>
    </tr>
    </table>

    <script>
    menuSelect(itmCurrent);
    </script>

    </body>
    </html>
     
    Brie, Mar 15, 2006
    #1
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Andrew Kidd
    Replies:
    3
    Views:
    495
    Andrew Kidd
    Apr 22, 2004
  2. JustSomeGuy

    Sorting lists of lists...

    JustSomeGuy, Jun 17, 2004, in forum: C++
    Replies:
    0
    Views:
    342
    JustSomeGuy
    Jun 17, 2004
  3. Jon Slaughter

    lists of lists

    Jon Slaughter, Dec 13, 2004, in forum: C++
    Replies:
    4
    Views:
    453
    Buster
    Dec 13, 2004
  4. =?UTF-8?B?w4FuZ2VsIEd1dGnDqXJyZXogUm9kcsOtZ3Vleg==

    List of lists of lists of lists...

    =?UTF-8?B?w4FuZ2VsIEd1dGnDqXJyZXogUm9kcsOtZ3Vleg==, May 8, 2006, in forum: Python
    Replies:
    5
    Views:
    442
    =?UTF-8?B?w4FuZ2VsIEd1dGnDqXJyZXogUm9kcsOtZ3Vleg==
    May 15, 2006
  5. Andrew Kidd

    multiple dropdown lists = multiple data readers???

    Andrew Kidd, Apr 20, 2004, in forum: ASP .Net Web Controls
    Replies:
    1
    Views:
    205
    Andrew Kidd
    Apr 21, 2004
Loading...

Share This Page