Jos*_*rzo 4 javascript asp.net checkbox gridview
我需要在gridview中计算已选中的复选框,但我不知道该怎么做.也许我可以使用JavaScript并将计数保存在文本框中,样式显示为none.我怎样才能做到这一点?
我写了客户端和服务器端的方法,看看它们并选择最适合你的方式!
请注意我已经将jQuery用于客户端逻辑,因为它是在客户端上操作DOM的更现代的方式
资源:
%>
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
<script src="http://code.jquery.com/jquery-1.8.2.js" type="text/javascript"></script>
<script type="text/javascript">
function GetMarriedEmployees() {
var counter = 0;
$("#<%=gvEmployees.ClientID%> input[id*='chkIsMarried']:checkbox").each(function (index) {
if ($(this).is(':checked'))
counter++;
});
alert(counter);
}
</script>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<asp:GridView ID="gvEmployees" AutoGenerateColumns="false" runat="server">
<Columns>
<asp:BoundField DataField="EmployeeId" />
<asp:BoundField DataField="EmployeeName" />
<asp:TemplateField>
<ItemTemplate>
<asp:CheckBox ID="chkIsMarried" runat="server" Checked='<%# Bind("IsMarried") %>' />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<asp:Button ID="btnGetMarried" runat="server" Text="Server" OnClick="btnGetMarried_Click" /><br />
<input type="button" value="Client" onclick="GetMarriedEmployees()" />
</asp:Content>
Run Code Online (Sandbox Code Playgroud)
代码背后:
namespace WebApplication1
{
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
List<Employees> employees = new List<Employees>()
{
new Employees{EmployeeId=1, EmployeeName="Bob", IsMarried=true},
new Employees{EmployeeId=2, EmployeeName="John", IsMarried=true}
};
gvEmployees.DataSource = employees;
gvEmployees.DataBind();
}
}
protected void btnGetMarried_Click(object sender, EventArgs e)
{
int marriedEmployees = 0;
foreach (GridViewRow row in gvEmployees.Rows)
{
var isMarried = (CheckBox)row.FindControl("chkIsMarried");
if(isMarried.Checked)
marriedEmployees++;
}
Response.Write(String.Format("Number of married employees = {0}",marriedEmployees.ToString()));
}
public class Employees
{
public int EmployeeId { get; set; }
public string EmployeeName { get; set; }
public bool IsMarried { get; set; }
}
}
Run Code Online (Sandbox Code Playgroud)
编辑:
我怀疑你可能是一个VB.NET开发人员,所以这里是服务器端代码的VB版本:
Public Class _Default
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
If Not Page.IsPostBack Then
Dim employees As New List(Of Employees)
Dim employee1 As Employees = New Employees()
employee1.EmployeeId = 1
employee1.EmployeeName = "Bob"
employee1.IsMarried = False
Dim employee2 As Employees = New Employees()
employee2.EmployeeId = 2
employee2.EmployeeName = "John"
employee2.IsMarried = True
employees.Add(employee1)
employees.Add(employee2)
gvEmployees.DataSource = employees
gvEmployees.DataBind()
End If
End Sub
Protected Sub btnGetMarried_Click(ByVal sender As Object, ByVal e As EventArgs) Handles btnGetMarried.Click
Dim marriedEmployees As Integer = 0
For Each row As GridViewRow In gvEmployees.Rows
Dim isMarried As CheckBox = row.FindControl("chkIsMarried")
If isMarried.Checked Then
marriedEmployees += 1
End If
Next
Response.Write(String.Format("Number of married employees = {0}", marriedEmployees))
End Sub
End Class
Public Class Employees
Public Property EmployeeId As Integer
Public Property EmployeeName As String
Public Property IsMarried As Boolean
End Class
Run Code Online (Sandbox Code Playgroud)
一个JavaScript解决方案:
function CheckBoxCount() {
var gv = document.getElementById("<%= Gridview1.ClientID %>");
var inputList = gv.getElementsByTagName("input");
var numChecked = 0;
for (var i = 0; i < inputList.length; i++) {
if (inputList[i].type == "checkbox" && inputList[i].checked) {
numChecked = numChecked + 1;
}
}
alert(numChecked);
}
Run Code Online (Sandbox Code Playgroud)
加价:
<asp:GridView AllowSorting="true" ID="Gridview1" Width="98%" AutoGenerateColumns="False" runat="server">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:CheckBox ID="cb_count" runat="server" onclick="CheckBoxCount();"></asp:CheckBox>
</ItemTemplate>
</asp:TemplateField>
...
</Columns>
</asp:GridView>
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
13931 次 |
| 最近记录: |