DevX Home    Today's Headlines   Articles Archive   Tip Bank   Forums   

Results 1 to 4 of 4

Thread: dynamically build navigation bar

  1. #1
    Brian Guest

    dynamically build navigation bar

    I am attempting to build a navigation bar across the top of the page using
    ASP. I can get the bar to build correctly, but I am having trouble solving
    a problem that I'm afraid will plague me in the distant future. I am
    building a table with one row and and one cell in that row. I keep putting
    links in the cell and allow the links to simply build to the number of links
    in the database. Right now I have 8 different links in the navigation bar
    and there is plenty of room for the links across the page, but if I
    eventually have 15 or 20 links I would like the links to create a second
    row. I thought that the links would automatically wrap within the cell but
    they appear to build the links closer and closer together and it never
    wraps. Here is the code I am using with ASP. The array "aLinks" is a two
    dimensional array with one element as the URL and the other element as the
    Link text to be displayed. I will paste the final interpreted code below
    that so you can see how it turns out. Disregard the ugly color scheme
    because that's not what I'm actually using. I need to find a way to make
    the links wrap to another line, but it has to be done dynamically so it will
    look correct with 5 or 30 links. Any suggestions on how to solve this
    problem would be appreciated.

    <table bgcolor="red" border="0" width="100%" cellpadding="0" cellspacing="0"
    align="center">
    <tr>
    <%

    for LinkRecs=0 to ubound(aLinks,2)
    %>
    <td align="center" height="20" valign="middle"><a class="navbar"
    href="<%=aLinks(0,LinkRecs)%>">&nbsp;&nbsp;<%=aLinks(1,LinkRecs)%>&nbsp;&nbs
    p;</a></td>

    <%next%>
    </tr>
    </table>

    The final code looks like this:

    <html>
    <head>
    <title>Untitled</title>
    </head>
    <body>
    <table bgcolor="red" border="0" width="100%" cellpadding="0" cellspacing="0"
    align="center">
    <tr>
    <td align="center" height="20" valign="middle"><a class="navbar"
    href="tools/toolsmain.asp">&nbsp;&nbsp;Tools&nbsp;&nbsp;</a></td>
    <td align="center" height="20" valign="middle"><a class="navbar"
    href="library/libmain.asp">&nbsp;&nbsp;Library&nbsp;&nbsp;</a></td>
    <td align="center" height="20" valign="middle"><a class="navbar"
    href="linksmain.asp">&nbsp;&nbsp;Links&nbsp;&nbsp;</a></td>
    <td align="center" height="20" valign="middle"><a class="navbar"
    href="cboinfo/infomain.asp">&nbsp;&nbsp;CBO Info&nbsp;&nbsp;</a></td>
    <td align="center" height="20" valign="middle"><a class="navbar"
    href="ratemanagement.asp">&nbsp;&nbsp;Rate Management&nbsp;&nbsp;</a></td>
    <td align="center" height="20" valign="middle"><a class="navbar"
    href="voiceaudit.asp">&nbsp;&nbsp;Voice Audit&nbsp;&nbsp;</a></td>
    <td align="center" height="20" valign="middle"><a class="navbar"
    href="dataaudit.asp">&nbsp;&nbsp;Data Audit&nbsp;&nbsp;</a></td>
    <td align="center" height="20" valign="middle"><a class="navbar"
    href="errorsuspense.asp">&nbsp;&nbsp;Error Suspense&nbsp;&nbsp;</a></td>
    <td align="center" height="20" valign="middle"><a class="navbar"
    href="tools/cpeshipdirect/cpesd.asp">&nbsp;&nbsp;CPE Ship
    Direct&nbsp;&nbsp;</a></td>
    <td align="center" height="20" valign="middle"><a class="navbar"
    href="contact/contactmain.asp">&nbsp;&nbsp;Contact Us&nbsp;&nbsp;</a></td>
    </tr>
    </table>
    </body>
    </html>







  2. #2
    Kris Eiben Guest

    Re: dynamically build navigation bar

    Keep a count of the number of links you've processed -- when it gets to a
    certain number or multiple thereof (use the mod operator -- if mod(numlinks,
    numinrow) = 0), throw in a "</tr><tr>" to start a new row. Then check the
    number at the end and add blank cells to fill.

    Brian wrote in message <39e37fb5$1@news.devx.com>...
    >I am attempting to build a navigation bar across the top of the page using
    >ASP. I can get the bar to build correctly, but I am having trouble solving
    >a problem that I'm afraid will plague me in the distant future. I am
    >building a table with one row and and one cell in that row. I keep putting
    >links in the cell and allow the links to simply build to the number of

    links
    >in the database. Right now I have 8 different links in the navigation bar
    >and there is plenty of room for the links across the page, but if I
    >eventually have 15 or 20 links I would like the links to create a second
    >row. I thought that the links would automatically wrap within the cell but
    >they appear to build the links closer and closer together and it never
    >wraps. Here is the code I am using with ASP. The array "aLinks" is a two
    >dimensional array with one element as the URL and the other element as the
    >Link text to be displayed. I will paste the final interpreted code below
    >that so you can see how it turns out. Disregard the ugly color scheme
    >because that's not what I'm actually using. I need to find a way to make
    >the links wrap to another line, but it has to be done dynamically so it

    will
    >look correct with 5 or 30 links. Any suggestions on how to solve this
    >problem would be appreciated.
    >
    ><table bgcolor="red" border="0" width="100%" cellpadding="0"

    cellspacing="0"
    >align="center">
    > <tr>
    > <%
    >
    > for LinkRecs=0 to ubound(aLinks,2)
    > %>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="<%=aLinks(0,LinkRecs)%>">&nbsp;&nbsp;<%=aLinks(1,LinkRecs)%>&nbsp;&nb

    s
    >p;</a></td>
    >
    > <%next%>
    > </tr>
    ></table>
    >
    >The final code looks like this:
    >
    ><html>
    ><head>
    > <title>Untitled</title>
    ></head>
    ><body>
    ><table bgcolor="red" border="0" width="100%" cellpadding="0"

    cellspacing="0"
    >align="center">
    > <tr>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="tools/toolsmain.asp">&nbsp;&nbsp;Tools&nbsp;&nbsp;</a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="library/libmain.asp">&nbsp;&nbsp;Library&nbsp;&nbsp;</a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="linksmain.asp">&nbsp;&nbsp;Links&nbsp;&nbsp;</a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="cboinfo/infomain.asp">&nbsp;&nbsp;CBO Info&nbsp;&nbsp;</a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="ratemanagement.asp">&nbsp;&nbsp;Rate Management&nbsp;&nbsp;</a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="voiceaudit.asp">&nbsp;&nbsp;Voice Audit&nbsp;&nbsp;</a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="dataaudit.asp">&nbsp;&nbsp;Data Audit&nbsp;&nbsp;</a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="errorsuspense.asp">&nbsp;&nbsp;Error Suspense&nbsp;&nbsp;</a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="tools/cpeshipdirect/cpesd.asp">&nbsp;&nbsp;CPE Ship
    >Direct&nbsp;&nbsp;</a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="contact/contactmain.asp">&nbsp;&nbsp;Contact Us&nbsp;&nbsp;</a></td>
    > </tr>
    ></table>
    ></body>
    ></html>
    >
    >
    >
    >
    >
    >




  3. #3
    Slythetove Guest

    Re: dynamically build navigation bar


    Since all you are doing is writing text links, meaning there are no alignment
    issues with graphics, why not just use one data cell and keep adding links.
    If your table has a maximum width set you should see wrapping occur at that
    point. good luck...

    "Brian" <brian.martens@wcom.com> wrote:
    >I am attempting to build a navigation bar across the top of the page using
    >ASP. I can get the bar to build correctly, but I am having trouble solving
    >a problem that I'm afraid will plague me in the distant future. I am
    >building a table with one row and and one cell in that row. I keep putting
    >links in the cell and allow the links to simply build to the number of links
    >in the database. Right now I have 8 different links in the navigation bar
    >and there is plenty of room for the links across the page, but if I
    >eventually have 15 or 20 links I would like the links to create a second
    >row. I thought that the links would automatically wrap within the cell

    but
    >they appear to build the links closer and closer together and it never
    >wraps. Here is the code I am using with ASP. The array "aLinks" is a two
    >dimensional array with one element as the URL and the other element as the
    >Link text to be displayed. I will paste the final interpreted code below
    >that so you can see how it turns out. Disregard the ugly color scheme
    >because that's not what I'm actually using. I need to find a way to make
    >the links wrap to another line, but it has to be done dynamically so it

    will
    >look correct with 5 or 30 links. Any suggestions on how to solve this
    >problem would be appreciated.
    >
    ><table bgcolor="red" border="0" width="100%" cellpadding="0" cellspacing="0"
    >align="center">
    > <tr>
    > <%
    >
    > for LinkRecs=0 to ubound(aLinks,2)
    > %>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="<%=aLinks(0,LinkRecs)%>"> <%=aLinks(1,LinkRecs)%> &nbs
    >p;</a></td>
    >
    > <%next%>
    > </tr>
    ></table>
    >
    >The final code looks like this:
    >
    ><html>
    ><head>
    > <title>Untitled</title>
    ></head>
    ><body>
    ><table bgcolor="red" border="0" width="100%" cellpadding="0" cellspacing="0"
    >align="center">
    > <tr>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="tools/toolsmain.asp"> Tools </a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="library/libmain.asp"> Library </a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="linksmain.asp"> Links </a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="cboinfo/infomain.asp"> CBO Info </a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="ratemanagement.asp"> Rate Management </a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="voiceaudit.asp"> Voice Audit </a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="dataaudit.asp"> Data Audit </a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="errorsuspense.asp"> Error Suspense </a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="tools/cpeshipdirect/cpesd.asp"> CPE Ship
    >Direct </a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="contact/contactmain.asp"> Contact Us </a></td>
    > </tr>
    ></table>
    ></body>
    ></html>
    >
    >
    >
    >
    >
    >



  4. #4
    christopher Guest

    Re: dynamically build navigation bar


    "Brian" <brian.martens@wcom.com> wrote:
    >I am attempting to build a navigation bar across the top of the page using
    >ASP. I can get the bar to build correctly, but I am having trouble solving
    >a problem that I'm afraid will plague me in the distant future. I am
    >building a table with one row and and one cell in that row. I keep putting
    >links in the cell and allow the links to simply build to the number of links
    >in the database. Right now I have 8 different links in the navigation bar
    >and there is plenty of room for the links across the page, but if I
    >eventually have 15 or 20 links I would like the links to create a second
    >row. I thought that the links would automatically wrap within the cell

    but
    >they appear to build the links closer and closer together and it never
    >wraps. Here is the code I am using with ASP. The array "aLinks" is a two
    >dimensional array with one element as the URL and the other element as the
    >Link text to be displayed. I will paste the final interpreted code below
    >that so you can see how it turns out. Disregard the ugly color scheme
    >because that's not what I'm actually using. I need to find a way to make
    >the links wrap to another line, but it has to be done dynamically so it

    will
    >look correct with 5 or 30 links. Any suggestions on how to solve this
    >problem would be appreciated.
    >
    ><table bgcolor="red" border="0" width="100%" cellpadding="0" cellspacing="0"
    >align="center">
    > <tr>
    > <%
    >
    > for LinkRecs=0 to ubound(aLinks,2)
    > %>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="<%=aLinks(0,LinkRecs)%>"> <%=aLinks(1,LinkRecs)%> &nbs
    >p;</a></td>
    >
    > <%next%>
    > </tr>
    ></table>
    >
    >The final code looks like this:
    >
    ><html>
    ><head>
    > <title>Untitled</title>
    ></head>
    ><body>
    ><table bgcolor="red" border="0" width="100%" cellpadding="0" cellspacing="0"
    >align="center">
    > <tr>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="tools/toolsmain.asp"> Tools </a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="library/libmain.asp"> Library </a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="linksmain.asp"> Links </a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="cboinfo/infomain.asp"> CBO Info </a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="ratemanagement.asp"> Rate Management </a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="voiceaudit.asp"> Voice Audit </a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="dataaudit.asp"> Data Audit </a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="errorsuspense.asp"> Error Suspense </a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="tools/cpeshipdirect/cpesd.asp"> CPE Ship
    >Direct </a></td>
    > <td align="center" height="20" valign="middle"><a class="navbar"
    >href="contact/contactmain.asp"> Contact Us </a></td>
    > </tr>
    ></table>
    ></body>
    ></html>
    >
    >Brian,

    Try placing your <td> tags outside of your loop. That way your links will
    wrap when you hit the maximum width of your table. As it is now, you are
    just adding more and more cells to the same row.

    Chris.
    >
    >
    >
    >



Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center
 
 
FAQ
Latest Articles
Java
.NET
XML
Database
Enterprise
Questions? Contact us.
C++
Web Development
Wireless
Latest Tips
Open Source


   Development Centers

   -- Android Development Center
   -- Cloud Development Project Center
   -- HTML5 Development Center
   -- Windows Mobile Development Center