Click here to Skip to main content
16,016,500 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
Hi friends,


i had tried verical scrol for a grid vew,But the vales on the page will change according to the dropdown select.so i cant have a static height because on one select there are only two records which has to be displayed and on another select there are 8-24 records to get displayed .

Can any one share the code with me ?

Thanks

i used the below script and called the funtion in cs page

HTML
ScriptManager.RegisterStartupScript(Page, this.GetType(), "Key", "<script>MakeStaticHeader('" + grdaccess.ClientID + "',180,800,40,true);</script>", false);



    function MakeStaticHeader(gridId, height, width, headerHeight, isFooter) {
           var tbl = document.getElementById(gridId);
           if (tbl) {
               var DivHR = document.getElementById('DivHeaderRow');
               var DivMC = document.getElementById('DivMainContent1');
               var DivFR = document.getElementById('DivFooterRow');


               //*** Set divheaderRow Properties ****
               DivHR.style.height = headerHeight + 'px';
               DivHR.style.width = (parseInt(width) - 16) + 'px';
               DivHR.style.position = 'relative';
               DivHR.style.top = '0px';
               DivHR.style.zIndex = '10';
               DivHR.style.verticalAlign = 'top';


               //*** Set divMainContent Properties ****

               DivMC.style.width = width + 'px';
               DivMC.style.height = 'relative';
               DivMC.style.position = 'relative';
               DivMC.style.top = -headerHeight + 'px';
               DivMC.style.zIndex = '1';


               //*** Set divFooterRow Properties ****
               DivFR.style.width = (parseInt(width) - 16)+ 'px';
               DivFR.style.position = 'relative';
               DivFR.style.top = -headerHeight + 'px';
               DivFR.style.verticalAlign = 'top';
               DivFR.style.paddingtop = '2px';


               if (isFooter) {
                   var tblfr = tbl.cloneNode(true);
                   tblfr.removeChild(tblfr.getElementsByTagName('tbody')[0]);
                   var tblBody = document.createElement('tbody');
                   tblfr.style.width = '100%';
                   tblfr.cellSpacing = "0";


                   tblfr.border = "0px";
                   tblfr.rules = "none";
                   //*****In the case of Footer Row *******
                   tblBody.appendChild(tbl.rows[tbl.rows.length - 1]);
                   tblfr.appendChild(tblBody);
                   DivFR.appendChild(tblfr);
               }
               //****Copy Header in divHeaderRow****
               DivHR.appendChild(tbl.cloneNode(true));
           }
       }






       function OnScrollDiv(Scrollablediv) {
           document.getElementById('DivHeaderRow').scrollLeft = Scrollablediv.scrollLeft;
           document.getElementById('DivFooterRow').scrollLeft = Scrollablediv.scrollLeft;
       }
Posted
Updated 5-Sep-12 22:58pm
v2

Hi,
put it in scrollable div like the code below

XML
<div style="height:400px; overflow:scroll">

<asp:gridview id="GridView1" runat="server">
    </asp:gridview>

</div>
 
Share this answer
 
v2
Keep your gridview inside a div or panel and make that div or panel scrollable.
 
Share this answer
 
Comments
Member 8155568 6-Sep-12 4:56am    
i did it with a div already


<div style="overflow:scroll;" önscroll="OnScrollDiv(this)" id="DivMainContent1">
Sunil Kumar Pandab 6-Sep-12 6:07am    
Try this one :-
<asp:Panel ID="Panel1" runat="server" ScrollBars="Vertical" Height="500px">
<asp:gridview id="GridView1" runat="server">

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900