planetz Ответов: 0

Статический заголовок Gridview-ширина заголовка и строк не выравнивается


Привет,

Я пытаюсь сделать заголовок gridview статичным и прокрутить вниз тело. Я пробовал несколько css и jquery, но ни один из них не работал для меня вообще, кроме этого.

Теперь он работает, заголовок и ширина строки не выравниваются. Нужна помощь!!.

здесь scroll.js

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) - 7) + '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.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;
}



css для gridview:

/* gridview design */
.mydatagrid
{
    width: 80%;
    border: none;
    min-width: 80%;
    position:relative;
}

.header
{
    background-color: #8B8DE3;
    font-family:Calibri;
    color: White;
    border:1px solid black;
    text-align: center;
    font-size:large;
    /*padding: 2px 2px 2px 2px;*/
}
 
.rows
{
    background-color: #D9D9EA;
    font-family:Calibri;
    font-size:medium;
    color: black;
    text-align: center;
    border: 1px solid black;
}


файл ASPX:

<table width="100%">
    <tr><td></td><td align="center">
    
    <div id="DivRoot" align="center">
    <div style="overflow: hidden;" id="DivHeaderRow">
    </div>
    
     <div style="overflow:scroll;" onscroll="OnScrollDiv(this)" id="DivMainContent">
     
        <asp:GridView ID="grid_score" runat="server" CssClass="mydatagrid" HeaderStyle-CssClass="header" 

        RowStyle-CssClass="rows" AlternatingRowStyle-CssClass="alternaterow" AutoGenerateColumns="false">
        <Columns>
        
        </Columns>
        </asp:GridView>
        </div>
      </div>
        </td><td></td></tr>
    </table>


.файл CS :

protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                page_onLoad();
                bind_grid();
                ScriptManager.RegisterStartupScript(Page, this.GetType(), "Key", "<script>MakeStaticHeader('" + grid_score.ClientID + "', 500, 900 , 35 ,false); </script>", false);
            }
        }


Что я уже пробовал:

я попробовал приведенный выше код, и заголовок и строки не выравниваются

0 Ответов