当前位置: 移动技术网 > IT编程>开发语言>.net > ASP.NET 固定标题列与栏位的具体实现

ASP.NET 固定标题列与栏位的具体实现

2017年12月12日  | 移动技术网IT编程  | 我要评论
apsx 页面代码: js复制代码 代码如下:       <script src="../js/jque

apsx 页面代码: js

复制代码 代码如下:
      
<script src="../js/jquery-1.8.3.min.js" type="text/javascript"></script>    -
    <script src="../js/jquery-ui-1.10.3.custom.js" type="text/javascript"></script>

    <script src="../js/gridviewscroll.min.js" type="text/javascript"></script>

    <link href="../css/gridviewscroll.css" rel="stylesheet" type="text/css" />

//以上的文件都可以直接到网上下载的

    <script type="text/javascript">

        $(document).ready(function() {
            gridviewscroll();
        });

        function gridviewscroll() {

//  因为我的gridview 要放在一个div中所以要获得对应的高度和宽度,一般直接数字设置就好了

            var gridwidth = $("#divservic").width();
            var gridheight = $("#divservic").height();

            var headerheight = $("#divheader").height();

            gridheight = gridheight - headerheight;

            $('#<%=gridview2.clientid%>').gridviewscroll({
            width: gridwidth,//宽度 一定不能用100%  可直接写死
            height: gridheight,//高度  可以直接写死
            freezesize:4//控制头几列不动
            });
        }


复制代码 代码如下:

<div id="divservic" style="width: 100%;margin-bottom: 2px; height:220px;">

                            <asp:gridview id="gridview2" runat="server" cellpadding="4" forecolor="#333333" width="100%"
                                bordercolor="#d1ddaa" allowpaging="true" datakeynames="installationid"
                                onpageindexchanging="gridview2_pageindexchanging"
                                onrowdatabound="gridview2_rowdatabound"
                                onrowdeleting="gridview2_rowdeleting" autogeneratecolumns="false"
                                allowsorting="true" onsorting="gridview2_sorting">
                                <rowstyle cssclass="gridviewscrollitem"  />>-------------------------------------------------------------这里的样式要添加
                                <footerstyle backcolor="#1c5e55" font-bold="true" forecolor="white" />
                                <pagerstyle cssclass="gridviewscrollpager"  />-------------------------------------------------------------这里的样式要添加
                                <selectedrowstyle backcolor="#c5bbaf"  />
                                <headerstyle cssclass="gridviewscrollheader" />-------------------------------------------------------------这里的样式要添加
                                <editrowstyle backcolor="#7c6f57" />
                                <alternatingrowstyle backcolor="white" bordercolor="#d1ddaa" />
                                <columns>
                                    <asp:templatefield>
                                        <itemtemplate>
                                            <asp:checkbox id="ckbitem" runat="server" />
                                        </itemtemplate>

                                    </asp:templatefield>
                                 <asp:boundfield datafield="installationid" headertext="installationid"
                                        sortexpression="installationid" />
                                    <asp:boundfield datafield="completed" headertext="completed" />
                                    <asp:boundfield datafield="tid" headertext="tid" />
                                    <asp:boundfield datafield="mid" headertext="mid" />
                                    <asp:boundfield datafield="bank" headertext="bank" />
                                    <asp:boundfield datafield="model" headertext="model" />
                                    <asp:boundfield datafield="barcode" headertext="barcode" />
                                    <asp:boundfield datafield="datereq" headertext="datereq"
                                        sortexpression="datereq" />

                                </columns>
                            </asp:gridview>
                         </div>

如您对本文有疑问或者有任何想说的,请点击进行留言回复,万千网友为您解惑!

相关文章:

验证码:
移动技术网