Gridview fixed header cloneNode duplicates value

362 views Asked by At

I have a gridview with textboxes and checkboxes inside each row. Textboxes have bound watermarks in it.(Bound it with hidden fields from client side on first page load) When i want to fix the gridview header with javascript code where i find from forums, after postback, the watermark value duplicates. if i comment out :

DivHR.appendChild(tbl.cloneNode(true));

this line, the value doesnt duplicate but the header scrolls down then. how can i solve this? What's the problem? I can't solve it about two weeks. Please help..

Here is the code:

<script language="javascript" type="text/javascript">
function MakeStaticHeader(gridId, height, width, headerHeight, isFooter) {
    var tbl = document.getElementById(gridId);
        if (tbl) {
        var DivHR = document.getElementById('DivHeaderRow');
        var DivMC = document.getElementById('DivMainContent');
        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 = height + 'px';
        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.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;
}

Here is code-behind :

 protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        if (Session["kullanici"] == null)
        {
            Response.Redirect("Login.aspx");
        }
        else if (Request.QueryString["A_ID"] == null)
        {
            Response.Redirect("Sorular.aspx?A_ID=1&K_ID=" + Session["kullanici"]);
        }

        aciklama(); //The value of watermark get from database to hiddenfields with this function
    }

    kilitliSoru();
    varsayilanAciklamaDsbld();

    ScriptManager.RegisterStartupScript(Page, this.GetType(), "Key", "<script>MakeStaticHeader('" + GridView1.ClientID + "',500,1350, 39,false); </script>", false);

}

Before Postback After Postback

0

There are 0 answers