博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
gridview添加固定表头
阅读量:5036 次
发布时间:2019-06-12

本文共 3704 字,大约阅读时间需要 12 分钟。

方法1:运行后右键源文件直接把gridview中表头复制出来,在添加到一个div,然后把div的位置覆盖到原表头上。

ExpandedBlockStart.gif
View Code
                        <div id=
"
divTitle
" style=
"
position: relative; top: 7px; left: -21px; overflow: hidden;
                            width: 405px; border: 0px solid red; z-index: 
100
"
>
                            <table style=
"
width: 100%; border: 0px solid #CCCCCC;
" cellspacing=
"
0
">
                            <!-- 从gridview中复制出来的表头-->
                                <tr style=
"
color: Black; background-color: #CCCCCC; font-weight: bold; white-space: nowrap;
">
                                    <th scope=
"
col
">
                                        <input id=
"
chkAll
" οnclick=
"
javascript:SelectAllCheckboxes(this);
" type=
"
checkbox
" />全选
                                    </th>
                                    <th scope=
"
col
">
                                        编号
                                    </th>
                                    <th scope=
"
col
">
                                        处理人
                                    </th>
                                </tr>
                                <!---->
                            </table>
                        </div>

 

方法2:asp.net中的gridview添加固定表头,原理就是用js复制了一个gridview的表头,添加到一个div中,在把gridview中表头给覆盖住。

JS代码:(用setTimeout调用gHeader方法,如果直接使用gHeader中的if方法会报gdvList' 为空或不是对象,要再Gridview控件初始化完成之后调用js)

                            <script type=
"
text/javascript
" defer=
"
defer
">
                                setTimeout(gHeader, 
100);
                                function gHeader() {
                                    
if (document.getElementById(
"
gvTitle
") == 
null) {
                                        
var gdvList = document.getElementById(
"
GridView2
");
                                        
var gdvHeader = gdvList.cloneNode(
true);
                                        gdvHeader.id = 
"
gvTitle
";
                                        
for (i = gdvHeader.rows.length - 
1; i > 
0; i--) {
                                            gdvHeader.deleteRow(i);
                                        }
                                        document.getElementById(
"
divTitle
").appendChild(gdvHeader);
                                        
var div = document.getElementById(
"
divGvData
");
                                        
var tbl = document.getElementById(
"
divTitle
");
                                        tbl.style.position = 
"
absolute
";
                                        tbl.style.zIndex = 
100;
                                        tbl.style.top = div.offsetTop;
                                        tbl.style.left = div.offsetLeft;
                                    } 
                                }
        function SelectAllCheckboxes(spanChk) {
            var oItem = spanChk.children;
            var theBox = (spanChk.type == "checkbox") ? spanChk : spanChk.children.item[0];
            xState = theBox.checked;
            var elm = theBox.form.elements;
            for (i = 0; i < elm.length; i++)
                if (elm[i].type == "checkbox") {
                if (elm[i].checked != xState)
                    elm[i].click();
            }
        }
                            </script>

aspx 页面代码:

ExpandedBlockStart.gif
View Code
<div style=
"
width: 410px; height: 180px; overflow-x: hidden; overflow-y: auto
" id=
"
dvBody
">
                        <div id=
"
divTitle
" style=
"
position: relative; top:10px; left:0px; overflow: hidden;
                            width:400px; border: 0px solid red;
"
>
                        </div>
                        <div id=
"
divGvData
" runat=
"
server
" style=
"
position: relative; top:0px; left:0px;
                           overflow-x: hidden; overflow-y: auto; width: 400px; height: 180px;
"
 class=
"bar
"
                            <asp:GridView ID=
"
GridView2
" runat=
"
server
" AutoGenerateColumns=
"
False
" DataKeyNames=
"
ProcessorID,Processor
"
                                Width=
"
405px
" BackColor=
"
White
" BorderColor=
"
#999999
" BorderStyle=
"
Solid
" BorderWidth=
"
1px
"
                                CellPadding=
"
3
" ForeColor=
"
Black
" GridLines=
"
Vertical
">
                                <Columns>
                                    <asp:TemplateField HeaderText=
"
全选
">
                                        <HeaderTemplate>
                                            <input id=
"
chkAll
" οnclick=
"
javascript:SelectAllCheckboxes(this);
" type=
"
checkbox
" />全选
                                        </HeaderTemplate>
                                        <ItemTemplate>
                                            <asp:CheckBox ID=
"
CheckBox1
" runat=
"
server
" />
                                        </ItemTemplate>
                                        <ItemStyle HorizontalAlign=
"
Center
" />
                                    </asp:TemplateField>
                                    <asp:BoundField DataField=
"
ProcessorID
" HeaderText=
"
编号
" ItemStyle-HorizontalAlign=
"
Center
"
                                        ReadOnly=
"
True
" SortExpression=
"
ProcessorID
">
                                        <ItemStyle HorizontalAlign=
"
Center
"></ItemStyle>
                                    </asp:BoundField>
                                    <asp:BoundField DataField=
"
Processor
" HeaderText=
"
处理人
" ItemStyle-HorizontalAlign=
"
Center
"
                                        ReadOnly=
"
True
">
                                        <ItemStyle HorizontalAlign=
"
Center
"></ItemStyle>
                                    </asp:BoundField>
                                </Columns>
                                <FooterStyle BackColor=
"
#CCCCCC
" />
                                <PagerStyle BackColor=
"
#999999
" ForeColor=
"
Black
" HorizontalAlign=
"
Center
" />
                                <SelectedRowStyle BackColor=
"
#000099
" Font-Bold=
"
True
" ForeColor=
"
White
" />
                                <HeaderStyle BackColor=
"
#CCCCCC
" Font-Bold=
"
True
" ForeColor=
"
Black
" Wrap=
"
false
"
                                 />
                                <AlternatingRowStyle BackColor=
"
#CCCCCC
" />
                            </asp:GridView>
                        </div>
                    </div>
 

转载于:https://www.cnblogs.com/Xingsoft-555/archive/2011/11/11/2245554.html

你可能感兴趣的文章
archive 打包出错 apple mach-o linker (id) error
查看>>
深度优先用法之检测有无环
查看>>
拆单发货-分布页
查看>>
Intellij Idea 2017创建web项目及tomcat部署实战
查看>>
Visualizing CNN Layer in Keras
查看>>
Java书籍经典Top10
查看>>
iperf——网络性能测试工具
查看>>
sysctl.conf网络内核参数说明(转)
查看>>
谷歌 chrome 浏览器开发者工具打不开的解决方法
查看>>
PHP 简单实现webSocket
查看>>
BZOJ 4085:[Sdoi2015]quality(round 2 音质检测)(数据结构)
查看>>
hdu 2433
查看>>
pure virtual、impure virtual、non-virtual函数的接口继承和实现继承
查看>>
Maven Jetty SSL配置
查看>>
HDU 1060 Left-most Digit
查看>>
POJ 2942 Knights of the Round Table
查看>>
centos 7环境下安装jdk
查看>>
Coursera台大机器学习课程笔记3 – 机器学习的可能性
查看>>
Leetcode 82
查看>>
Lab 1: Pipeline MIPS Processor
查看>>