初學者要知道的幾個GridView用法

1.自增列

<asp:TemplateField HeaderText="自增列" FooterText="自增列"> <ItemTemplate> <%# (Container.DataItemIndex+1).ToString()%> </ItemTemplate> </asp:TemplateField>

2.排序

protected void GridView1_Sorting(object sender, GridViewSortEventArgs e) { if (sort == "Desc") { sort = "Asc"; } else { sort = "Desc"; } DataView dv = bll.getAllStudent().Tables[0].DefaultView; dv.Sort = e.SortExpression + " "+sort; this.GridView1.DataSource = dv; this.GridView1.DataBind(); }

3.複選框全選js實現

//創建複選框 <asp:TemplateField HeaderText="<input type='checkbox' id='chk' name='chk' οnclick='checkJs(this.checked);' />全選" FooterText="全選"> <ItemTemplate> <input type="checkbox" id="checkboxname" name="checkboxname" value='<%# DataBinder.Eval(Container.DataItem, "id")%>' οnclick='SingleCheckJs();' /> </ItemTemplate> </asp:TemplateField> //js處理事件 <mce:script language="javascript" type="text/javascript"><!-- // 判斷多選是否與選中項（沒有選中的返回false） function slcNo_click() { if (document.form1.checkboxname.length) { for (var i=0;i<document.form1.checkboxname.length;i++) { if(document.form1.checkboxname[i].checked) { return true; } } } else { if(document.form1.checkboxname.checked) { return true; } } alert("請選擇後再操作！"); return false; } // 多選的全選與取消，此方法綁定在“全選”複選框上，<asp:TemplateField HeaderText="&lt;input type='checkbox' id='chk' name='chk' οnclick='checkJs(this.checked);' /&gt;全選" FooterText="全選"> function checkJs(boolvalue) { if(document.all.checkboxname.length>1) { for(var i=0;i<document.all.checkboxname.length;i++) { document.all.checkboxname[i].checked = boolvalue; } } else document.all.checkboxname.checked = boolvalue; } // 當被全選時，單個選後把“全選”複選框取消選擇,此方法綁定在每個複選框上，<input type="checkbox" id="checkboxname" name="checkboxname" value='<%# DataBinder.Eval(Container.DataItem, "id")%>' οnclick='SingleCheckJs();' /> function SingleCheckJs() { var flag1=false; var flag2=false; if (document.form1.checkboxname.length) { for (var i=0;i<document.form1.checkboxname.length;i++) { if(document.form1.checkboxname[i].checked) flag1 = true; else flag2 = true; } } else { if(document.form1.checkboxname.checked) flag1 = true; else flag2 = true; } if(flag1==true&&flag2==false) document.getElementById("chk").checked = true; else document.getElementById("chk").checked = false; } // --></mce:script> 獲取選中的值： this.Label3.Text = Request.Form.Get("checkboxname"); 結果：1101 ,1102 ,1104 ,1105 ,1103 處理： string str=""; string []ckb=null; str=Request.Form.Get("checkboxname"); ckb=str.Split(new char[]{','}); Response.Write("直接在頁面中得到的值爲："+str+"<br>"); Response.Write("處理後存放在數組中，如下：<br>"); for(int i=0;i<ckb.Length;i++) { Response.Write("ckb["+i+"]的值爲："+ckb[i]+"<br>"); } 結果： 1101 1102 1104 1105 1103

4.鼠標經過改變行的顏色

//js代碼 <mce:script type="text/javascript"><!-- if (!objbeforeItem) { var objbeforeItem=null; var objbeforeItembackgroundColor=null; } function ItemOver(obj) { if(objbeforeItem) { objbeforeItem.style.backgroundColor = objbeforeItembackgroundColor; } objbeforeItembackgroundColor = obj.style.backgroundColor; objbeforeItem = obj; obj.style.backgroundColor = "#B9D1F3"; } // --></mce:script> //GridView事件 protected void gvNews_RowDataBound(object sender, GridViewRowEventArgs e) { //行頭，尾，頁碼等過濾掉 if (e.Row.RowType.ToString() != DataControlRowType.Header.ToString()&&e.Row.RowType.ToString() != DataControlRowType.EmptyDataRow.ToString()&&e.Row.RowType.ToString() != DataControlRowType.Pager.ToString()&&e.Row.RowType.ToString()!= DataControlRowType.Footer.ToString() ) { e.Row.Attributes["onmouseover"] = "ItemOver(this)"; } }

5.加入單選框

<asp:TemplateField HeaderText="單選" FooterText="單選"> <ItemTemplate> <input type="radio" id="RadioName" name="RadioName" value='<%# Eval("PK_Id")%>' /> </ItemTemplate> </asp:TemplateField> 獲取選中的值： this.Label2.Text=Request.Form.Get("RadioName"); 結果：1103

 

要更深入，推薦

關於GridView中自定義分頁、單選、多選、排序、自增列的簡單應用