GirdView实现单选、FooterTemplate实现新建和PagerTemplate实现分页

  近期采用GridView实现一个信息列表,并且还要对这个列表的信息进行增、删、改操作,同时还需要分页功能。曾今看到有人做过这样的效果,在页脚增加分页操作和新建、修改、删除、保存的操作。

  点击—>新建,当前页记录集最后一行出现需要录入数据的空行控件。

  点击—>删除,需要先选中单选行,删除才执行操作。

  点击—>修改,需要先选中单选行,然后此行处于编辑状态,最后点击保存。

  实现单选具有两种方法:

  第一种:在模板列中加入RadioButton控件,通过Group不能实现单选的操作,需要JavaScript代码完成,如下

ContractedBlock.gif ExpandedBlockStart.gif 代码
 
   
1 // 判断单选框是否选择
2   function setRadio(nowRadio) {
3 var myForm, objRadio;
4 myForm = document.forms[ 0 ];
5 for ( var i = 0 ; i < myForm.length; i ++ ) {
6 if (myForm.elements[i].type == " radio " ) {
7 objRadio = myForm.elements[i];
8 if (objRadio != nowRadio && objRadio.name.indexOf( " GridView1 " ) > - 1 && objRadio.name.indexOf( " radBtn " ) > - 1 ) {
9 if (objRadio.checked) {
10 objRadio.checked = false ;
11 }
12 }
13 }
14 }
15 }

这种办法需要绑定客户端事件

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
        //给每个RadioButton1绑定setRadio事件
        ((RadioButton)e.Row.FindControl("RadioButton1")).Attributes.Add("onclick", "setRadio(this)");
}

 

  第二种:在GridView的模版列里,加html控件Radio控件

ContractedBlock.gif ExpandedBlockStart.gif 代码
 
   
1 < asp:GridView ID = " GridView2 " runat = " server " AutoGenerateColumns = " False " ShowHeader = " False " >
2 < Columns >
3 < asp:TemplateField >
4 < ItemTemplate >
5 < input type = " radio " name = " myRadio " value = ' <%# Container.DataItemIndex.ToString() %> ' >
6 </ ItemTemplate >
7 </ asp:TemplateField >
8 </ Columns >
9 </ asp:GridView >
10   < script type = " text/javascript " >
11 function setNowRadio(v)
12 {
13 var myForm,objRadio;
14 myForm = document.forms[ 0 ];
15 for (var i = 0 ;i < myForm.length;i ++ )
16 {
17 if (myForm.elements[i].type == " radio " )
18 {
19 objRadio = myForm.elements[i];
20 if (objRadio.value == v)
21 {
22 objRadio. checked = true ;
23 }
24 }
25 }
26 }
27 < asp:Literal ID = " jsLiteral " runat = " server " ></ asp:Literal >
28 </ script >
29  

 

后台可以通过Request.Form["myRadio"].ToString()获取到值,不用遍历控件。

下面是实现分页及其它功能的页面代码:

ContractedBlock.gif ExpandedBlockStart.gif 代码
 
   
1 < asp:GridView ID = " GridView1 " runat = " server "
2 Width = " 850px " AllowPaging = " True " CellPadding = " 3 " BackColor = " White "
3 BorderColor = " #E7E7FF " BorderStyle = " None " BorderWidth = " 1px "
4 Font - Size = " 10pt " ForeColor = " #333333 "
5 AutoGenerateColumns = " False "
6 onrowdatabound = " GridView1_RowDataBound "
7 AllowSorting = " True "
8 >
9 < Columns >
10 < asp:TemplateField AccessibleHeaderText = " True " HeaderText = " 单选 " >
11 < ItemTemplate >
12 < asp:RadioButton ID = " radBtn " runat = " server " />
13 </ ItemTemplate >
14 < EditItemTemplate >
15 < asp:RadioButton ID = " radBtn " runat = " server " />
16 </ EditItemTemplate >
17 < FooterTemplate >
18 < asp:RadioButton ID = " radBtn " runat = " server " />
19 </ FooterTemplate >
20 < FooterStyle HorizontalAlign = " Center " VerticalAlign = " Middle " />
21 < HeaderStyle Width = " 40px " />
22 < ItemStyle HorizontalAlign = " Center " VerticalAlign = " Middle " Width = " 40px " />
23 </ asp:TemplateField >
24 < asp:TemplateField HeaderText = " 编号 " >
25 < ItemTemplate >
26 < asp:Label ID = " labId " runat = " server " Text = ' <%# Bind("id") %> ' ></ asp:Label >
27 </ ItemTemplate >
28 < EditItemTemplate >
29 < asp:Label ID = " labIdE " ForeColor = " Red " runat = " server " Text = "" Width = " 60px " ></ asp:Label >
30 </ EditItemTemplate >
31 < FooterTemplate >
32 < asp:Label ID = " labIdI " ForeColor = " Red " runat = " server " Text = "" Width = " 60px " ></ asp:Label >
33 </ FooterTemplate >
34 < HeaderStyle Width = " 60px " />
35 < ItemStyle HorizontalAlign = " Center " VerticalAlign = " Middle " Width = " 60px " />
36 </ asp:TemplateField >
37 < asp:TemplateField HeaderText = " 名称 " >
38 < ItemTemplate >
39 < a href = ' <%# "DefSteps.aspx?id=" + Eval("id") %> ' ><% # Eval( " name " ) %></ a >
40 </ ItemTemplate >
41 < EditItemTemplate >
42 < asp:TextBox ID = " txtNameE " runat = " server " Width = " 200px " ></ asp:TextBox >
43 </ EditItemTemplate >
44 < FooterTemplate >
45 < asp:TextBox ID = " txtNameI " runat = " server " Width = " 200px " ></ asp:TextBox >
46 </ FooterTemplate >
47 < HeaderStyle Width = " 200px " />
48 < ItemStyle HorizontalAlign = " Left " VerticalAlign = " Middle " Width = " 200px " />
49 </ asp:TemplateField >
50 </ Columns >
51 < FooterStyle BackColor = " #C1CEF2 " Font - Bold = " True " ForeColor = " White " />
52 < PagerStyle BackColor = " #2461BF " ForeColor = " White " HorizontalAlign = " Center " />
53 < RowStyle BackColor = " #EFF3FB " ForeColor = " #4A3C8C " />
54 < SelectedRowStyle BackColor = " #738A9C " Font - Bold = " True " ForeColor = " #F7F7F7 " />
55 < HeaderStyle BackColor = " #6699CC " Font - Bold = " True " Font - Size = " Small " ForeColor = " White " />
56 < EditRowStyle BackColor = " #C1CEF2 " />
57 < AlternatingRowStyle BackColor = " White " />
58 < PagerTemplate >
59 < table width = " 100% " >
60 < tr >
61 < td align = " left " >
62 < asp:Button ID = " btnFirst " runat = " server " Enabled = " <%# ((GridView)Container.Parent.Parent).PageIndex!=0 %> " CausesValidation = " False " Text = " 首页 " onclick = " btnFirst_Click " />
63 < asp:Button ID = " BtnPre " runat = " server " Enabled = " <%# ((GridView)Container.Parent.Parent).PageIndex!=0 %> " CausesValidation = " False " Text = " 上一页 " onclick = " BtnPre_Click " />
64 < asp:Button ID = " BtnNext " runat = " server " Enabled = " <%# ((GridView)Container.Parent.Parent).PageIndex!=((GridView)Container.Parent.Parent).PageCount-1 %> "
65 CausesValidation = " False " Text = " 下一页 " onclick = " BtnNext_Click " />
66 < asp:Button ID = " BtnLast " runat = " server " Enabled = " <%# ((GridView)Container.Parent.Parent).PageIndex!=((GridView)Container.Parent.Parent).PageCount-1 %> "
67 CausesValidation = " False " Text = " 尾页 " onclick = " BtnLast_Click " />
68 </ td >
69 < td align = " center " >
70 当前第 < asp:Label ID = " LblPage " runat = " server " style = " text-align:center " Text = ' <%# GridView1.PageIndex + 1%> ' ></ asp:Label >
71 页 共 < asp:Label ID = " LblTotalPage " runat = " server " style = " text-align:center; " Text = ' <%# GridView1.PageCount %> ' ></ asp:Label >
72 </ td >
73 < td align = " right " >
74 < asp:Button ID = " BtnAdd " runat = " server " CommandName = " Insert " onclick = " BtnAdd_Click " Text = " 添加 " />
75 < asp:Button ID = " BtnModify " runat = " server " CommandName = " Update " onclick = " BtnModify_Click " Text = " 编辑 " />
76 < asp:Button ID = " BtnDelete " runat = " server " CommandName = " Delete " Text = " 删除 "
77 onclick = " BtnDelete_Click " />
78 < asp:Button ID = " BtnSave " runat = " server " CommandName = " Save " onclick = " BtnSave_Click " Text = " 保存 " />
79 < asp:Button ID = " BtnCancel " runat = " server " CommandName = " Cancel " Text = " 取消 "
80 onclick = " BtnCancel_Click " />
81 </ td >
82 </ tr >
83 </ table >
84 </ PagerTemplate >
85 </ asp:GridView >

具体的分页功能不是很难,也就不在这写了。

新建:GridView1.ShowFooter = true

删除:先判断是否选中操作

ContractedBlock.gif ExpandedBlockStart.gif 代码
 
   
1 protected void BtnDelete_Click( object sender, EventArgs e)
2 {
3 index = 0 ;
4 int checkNum = 0 ;
5 string id = "" ;
6 foreach (GridViewRow gvr in GridView1.Rows)
7 {
8 if (((RadioButton)gvr.FindControl( " radBtn " )).Checked)
9 {
10 index = gvr.RowIndex;
11 checkNum = 1 ;
12 id = ((Label)GridView1.Rows[index].FindControl( " labId " )).Text;
13 DeleteChart(id); // 执行删除操作
14   }
15 }
16 ViewData(); // 填充数据
17   if (checkNum == 0 )
18 {
19 ScriptManager.RegisterStartupScript( this , typeof (Page), " 提示 " , " <script>alert('选择要删除的行');</script> " , false );
20 return ;
21 }
22 }

 效果图如下:

2010052510030593.jpg

 

求助:在一次的误操作过程中发现了一个问题,就是当记录少于每页显示的记录数时,只有一页数据,PagerTemplate不显示,不知道大家发现这个问题没有,解决了好几天也没解决,希望各位挚友能给予帮助,再次感谢!

 

同时也希望各位朋友提出好的方法,共同交流 共同进步!

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值