Js获取Gridview中Dropdownlist选中状态

2018-06-22 06:21:03来源：未知阅读 ()

在Gridview中加入Dropdownlist模板列，加入DropDownlist 是一种常用的操作，其中涉及到如何获取选择项和Gridview重新绑定两个要点。

如图

前台代码如下

  1 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication2.WebForm1" %>
  2 
  3 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  4 
  5 <html xmlns="http://www.w3.org/1999/xhtml">
  6 <head id="Head1" runat="server">
  7     <title></title>
  8     <script type="text/javascript" src="Scripts/jquery-1.4.1.min.js"></script>
  9     <script language="javascript" type="text/javascript">
 10 
 11         function vary() {
 12 
 13             var table = document.getElementById("<%=grv1.ClientID %>");
 14             var finished = 1;
 15             for (var i = 1; i < table.rows.length; i++) {
 16                 var filled = table.rows[i].cells[1].getElementsByTagName("select")[0].value;
 17                 if (filled == 0) { finished = 0; break; }
 18             }
 19             if (finished == 0) { alert("Self Not finished"); return false; }
 20             else return true;
 21         }
 22 
 23         function vary2() {
 24             var finished = 1;
 25             var selects = document.getElementsByTagName("select");
 26             if (selects.length > 0)
 27                 for (var i = 0; i < selects.length; i++) {
 28                  if (selects[i].id.indexOf("ddlself", 0) > 0) 
 29                     {
 30                         if (selects[i].value == 0)
 31                         { finished = 0; break; }
 32                  }
 33 
 34                 }
 35             if (finished == 0) { alert("Not finished!"); return false; }
 36             else return true;
 37 
 38         }
 39         function vary3() {
 40 
 41             var finish = 1;
 42             $('table[id$=grv1]').find('tr').each(function (row) {
 43                 $ddl = $(this).find('select');
 44                 if ($ddl != "undefined") {
 45                     var d = $ddl.val();
 46                     if (d == 0) { finish = 0; }
 47                 }
 48 
 49             });
 50             if (finish == 0) { alert("Not finished!"); return false; }
 51             else return true;
 52         }
 53 
 54         function test() {
 55             var select = document.getElementById("ddl");
 56             if (select.value == 0) { alert("not finished"); return false; }
 57             else return true;
 58         }
 59 
 60         // $(document).ready(function(){$("input[id$=btnSave]").click(function(){vary3();});})
 61     </script>
 62 
 63 </head>
 64 
 65 <body>
 66 
 67     <form id="form1" runat="server">
 68     <div>
 69     <table width="100%"><tr >
 70     <td width="50%" align="center"><asp:gridview ID="grv1" runat="server" 
 71             GridColor="Black" AutoGenerateColumns="False" 
 72             onprerender="grv1_PreRender" >
 73         <Columns>
 74             <asp:BoundField HeaderText="Comments" DataField="Name" />
 75             <asp:TemplateField HeaderText="Self">
 76                 <ItemTemplate>
 77                     <asp:DropDownList ID="ddlself" runat="server">
 78                     <asp:ListItem Value="0" Text="N/A"></asp:ListItem>
 79                       <asp:ListItem Value="1" Text="1"></asp:ListItem>
 80                       <asp:ListItem Value="2" Text="2"></asp:ListItem>
 81                       <asp:ListItem Value="3" Text="3"></asp:ListItem>
 82                       <asp:ListItem Value="4" Text="4"></asp:ListItem>
 83                       <asp:ListItem Value="5" Text="5"></asp:ListItem>
 84                     </asp:DropDownList>
 85                 </ItemTemplate>
 86             </asp:TemplateField>
 87             <asp:TemplateField HeaderText="Supervisor">
 88                 <ItemTemplate>
 89                     <asp:DropDownList ID="ddlsupervisor" runat="server">
 90                        <asp:ListItem Value="0" Text="N/A"></asp:ListItem>
 91                       <asp:ListItem Value="1" Text="1"></asp:ListItem>
 92                       <asp:ListItem Value="2" Text="2"></asp:ListItem>
 93                       <asp:ListItem Value="3" Text="3"></asp:ListItem>
 94                       <asp:ListItem Value="4" Text="4"></asp:ListItem>
 95                       <asp:ListItem Value="5" Text="5"></asp:ListItem>
 96                     </asp:DropDownList>
 97                 </ItemTemplate>
 98             </asp:TemplateField>
 99         </Columns>
100         </asp:gridview></td><td width="50%"></td></tr>
101     </table>
102     <table width="100%">
103     <tr><td width ="30%"></td><td width ="30%"><asp:Button  ID="btnSave" Text="Save" 
104             runat="server" onclick="btnSave_Click"/></td><td></td></tr>
105     </table>
106     </div>
107     </form>
108 </body>
109 </html>

View Code

其中三个Js代码段均能实现功能，不过作为三个Jq,尚有不足，虽然undefined的引入使其功能可以实现，不过总归不是正统的解决办法，希望可以改进。

后台代码如下

 1 using System;
 2 using System.Collections.Generic;
 3 using System.Linq;
 4 using System.Web;
 5 using System.Web.UI;
 6 using System.Web.UI.WebControls;
 7 
 8 namespace WebApplication2
 9 {
10     public partial class WebForm1 : System.Web.UI.Page
11     {
12         protected void Page_Load(object sender, EventArgs e)
13         {
14 
15             if (!IsPostBack)
16             {
17                 Info a = new Info();
18                 a.Name = "a";
19                 Info b = new Info();
20                 b.Name = "b";
21                 Info c = new Info();
22                 c.Name = "c";
23                 Info d = new Info();
24                 d.Name = "d";
25                 List<Info> list = new List<Info>();
26 
27                 list.Add(a);
28                 list.Add(b);
29                 list.Add(c);
30                 list.Add(d);
31                 grv1.DataSource = list;
32                 grv1.DataBind();
33 
34                 btnSave.Attributes.Add("onclick", "javascript:vary();");
35             }
36         }
37 
38         protected void grv1_PreRender(object sender, EventArgs e)
39         {
40             if (ViewState["drp1"] != null)
41 
42                 Set(grv1);
43         }
44         protected void Set(GridView grvItem)
45         {
46             List<string> list = new List<string>();
47             list = (List<string>)ViewState["drp1"];
48             for (int row = 0; row < grvItem.Rows.Count; row++)
49             {
50                 DropDownList ddlSelf = (DropDownList)grvItem.Rows[row].FindControl("ddlself");
51                 ddlSelf.SelectedValue = list[row].ToString();
52 
53             }
54         }
55         protected void btnSave_Click(object sender, EventArgs e)
56         {
57 
58             List<string> list = new List<string>();
59             for (int row = 0; row < grv1.Rows.Count; row++)
60             {
61                 DropDownList ddlSelf = (DropDownList)grv1.Rows[row].Cells[1].FindControl("ddlself");
62                 string selectindex = ddlSelf.SelectedValue;
63                 list.Add(selectindex);
64             }
65             ViewState["drp1"] = new List<string>();
66             ViewState["drp1"] = list;
67 
68         }
69 
70     }
71 }