Scrollbar in "Table"

mcinar · January 2nd, 2005, 08:03 PM

Hi All,

I haven't seen it, but is it possible to have a Scrollbar option in "Table"?
Otherwise, is there any third party component available?

Thanks for your help,

mcinar

gingar · January 2nd, 2005, 10:34 PM

i believe you can use iframes.

<iframe frameborder="0" name="content" width="685" height="382" marginheight="5" marginwidth="5" scrolling="auto" src="content.html"></iframe>

mcinar · January 3rd, 2005, 01:31 PM

Thank you, Gingar.
It is a helpful information.

mcinar

Imar · January 3rd, 2005, 03:27 PM

Alternatively, you can use a <div> tag with the CSS overflow property set to auto. You'll need to put the column headings outside the <div> in a separate, same sized, table, like this:

Code:

<table style="width: 300px" cellpadding="0" cellspacing="0">
<tr>
    <td>Column 1</td>
    <td>Column 2</td>
</tr>
</table>
<div style="overflow: auto;height: 100px; width: 330px;">
<table style="width: 300px;" cellpadding="0" cellspacing="0">
<tr>
    <td>Value 1</td>
    <td>Value 2</td>
</tr>
<tr>
    <td>Value 1</td>
    <td>Value 2</td>
</tr>
<tr>
    <td>Value 1</td>
    <td>Value 2</td>
</tr>
<tr>
    <td>Value 1</td>
    <td>Value 2</td>
</tr>
<tr>
    <td>Value 1</td>
    <td>Value 2</td>
</tr>
<tr>
    <td>Value 1</td>
    <td>Value 2</td>
</tr>
</table>
</div>

Cheers,

Imar
---------------------------------------
Imar Spaanjaars
Everyone is unique, except for me.
While typing this post, I was listening to: Analog Worms Attack by Mr. Oizo (Track 1 from the album: Analog Worms Attack) What's This?

mcinar · January 4th, 2005, 10:48 AM

Thank you, Imar.
It will be very helpful.

mcinar

mcinar · January 13th, 2005, 01:07 PM

Hi Imar,

Your information is very helpful and it works.
I tried to use "style="overflow: auto;" in <div> for my codes, but it doesn't show the
scroll bars. Here is my code;

<%
sub display_authorized_user(rs)
    %>
    <div id="authorized_user_title" width ="300px" style="position:absolute; left: 380px; top: 220px;">
        <table border="0" rules="NONE">
                <tr>
                    <td class=td2 style="background-color:#000099; color=#FFFFFF;">AUTHORIZED USERS</td>
                </tr>
            </table>
    </div>

    <div id="authorized_user_2" width ="300px" height="50px" style="overflow: auto; position:absolute;left: 310px; top: 245px;">
        <table width="300px" height="50px" cellspacing="0" cellpadding="0" border="1" RULES="NONE">
            <% intCount = 0
                do while not rs.eof
                    if (intCount mod 2) = 0 then%>
                        <tr valign="top" class="tdleft" bgcolor="#ffffff">
                    <%else %>
                        <tr valign="top" class="tdleft" bgcolor="#dddddd">
                    <%end if

                    intCount = intCount + 1

                    call display_detail(rs)%>

                    </tr>

                <%rs.movenext
            loop%>
        </table>
    </div>
<%end sub%>

<%sub display_detail(rs)%>
    <td class=td2>
        <%
            strName = trim(FORMAT_FROM_DB(rs("First_Name_VC"))) & " " & trim(FORMAT_FROM_DB(rs("Last_Name_VC")))

            Response.Write "<a href=update_billing.asp?Authorized_User_ID=" & rs("Authorized_User_ID") & _
                                "&" & "Corp_ID=" & lngCorpID & "&" & "Update_Type=" & strUpdateType & ">" & _
                                strName & "</a>"%>
    </td>
<%end sub%>

Thanks for your help.

mcinar

mcinar · January 13th, 2005, 01:16 PM

Hi Imar,

I also tried to use "iframe". It works good. Only problem that I am having is I have a hyperlink field in the "iframe" and when you click on it, it calls another page.
But what it does, instead of bringing a new page it shows that page in the "iframe"

here is my code;

UPDATE_BILLING.ASP (with iframe):

It will be calling "display_authorized_user.asp" and this page has a hyperlink.

<%
sub display_authorized_user_2%>
    <div id="authorized_user_title" width ="300px" style="position:absolute; left: 380px; top: 220px;">
        <table border="0" rules="NONE">
                <tr>
                    <td class=td2 style="background-color:#000099; color=#FFFFFF;">AUTHORIZED USERS</td>
                </tr>
            </table>
    </div>

    <div id="authorized_user" width ="300px" style="position:absolute; left: 310px; top: 245px;">
            
            <iframe frameborder="1" name="authorized_user" width="300px" height="260px" marginheight="0" marginwidth="1"
                 scrolling="yes" src="display_authorized_user.asp?User=ADMIN&Corp_I D=<%=lngCorpID%>&Update_Type=<%=strUpdateType%>">
            </iframe>
    </div>
<%end sub%>

DISPLAY_AUHORIZED_USER.ASP:

<%sub display_detail(rs)%>
    <td class=td2>
        <%
            strName = trim(FORMAT_FROM_DB(rs("First_Name_VC"))) & " " & trim(FORMAT_FROM_DB(rs("Last_Name_VC")))

            if strUser = "ADMIN" then
                Response.Write "<a href=update_billing.asp?Authorized_User_ID=" & rs("Authorized_User_ID") & _
                                                    "&" & "Corp_ID=" & lngCorpID & "&" & "Update_Type=" & strUpdateType & _
                                                    "target=_blank & ">" & _
                                                    strName & "</a>"
            else
                    if len(trim(strName)) then
                        Response.Write strName
                        'Response.Write format_from_db(rs("name_1_vc"))
                    else
                        Response.Write " "
                    end if
            end if%>
    </td>
<%end sub%>

Thanks for your help,

mcinar

joefawcett · January 13th, 2005, 02:23 PM

Quote:

quote:Originally posted by mcinar
I tried to use "style="overflow: auto;" in <div> for my codes, but it doesn't show the
scroll bars.

I think you must specify width/height for this to work, it has to know what it is overflowing.

--

Joe (Microsoft MVP - XML)

mcinar · January 13th, 2005, 03:16 PM

Hi joefawcett,
thank you for your reply.
I am specifying the width and height.

Here is the complete code;

<%
sub display_authorized_user(rs)
    %>
    <div id="authorized_user_title" width ="300px" style="position:absolute; left: 380px; top: 220px;">
        <table border="0" rules="NONE">
                <tr>
                    <td class=td2 style="background-color:#000099; color=#FFFFFF;">AUTHORIZED USERS</td>
                </tr>
            </table>
    </div>

    <div id="authorized_user_2" width ="300px" height="50px" style="overflow: auto; position:absolute;left: 310px; top: 245px;">
        <table width="300px" height="50px" cellspacing="0" cellpadding="0" border="1" RULES="NONE">
            <% intCount = 0
                do while not rs.eof
                    if (intCount mod 2) = 0 then%>
                        <tr valign="top" class="tdleft" bgcolor="#ffffff">
                    <%else %>
                        <tr valign="top" class="tdleft" bgcolor="#dddddd">
                    <%end if

                    intCount = intCount + 1

                    call display_detail(rs)%>

                    </tr>

                <%rs.movenext
            loop%>
        </table>
    </div>
<%end sub%>

<%sub display_detail(rs)%>
    <td class=td2>
        <%
            strName = trim(FORMAT_FROM_DB(rs("First_Name_VC"))) & " " & trim(FORMAT_FROM_DB(rs("Last_Name_VC")))

            Response.Write "<a href=update_billing.asp?Authorized_User_ID=" & rs("Authorized_User_ID") & _
                                "&" & "Corp_ID=" & lngCorpID & "&" & "Update_Type=" & strUpdateType & ">" & _
                                strName & "</a>"%>
    </td>
<%end sub%>

Thanks for your help,

MCinar

Imar · January 13th, 2005, 03:36 PM

Just as in my example, you need to set the width of the outer div to be larger than the inner table. The difference between the two is the width of the scrollbar....

Cheers,

Imar
---------------------------------------
Imar Spaanjaars
Everyone is unique, except for me.
While typing this post, I was listening to: My Morning Song by The Black Crowes (Track 9 from the album: The Southern Harmony And Musical Companion) What's This?