4

グリッドビューでチェックされているチェックボックスを数える必要がありますが、その方法がわかりません。たぶん、JavaScriptを使用して、スタイル表示なしのテキストボックスにカウントを保存することができます。これどうやってするの?

4

5 に答える 5

8

私はこれを行うためのクライアント側とサーバー側の両方の方法を書きました。それらを見て、あなたに最も適した方法を選択してください。

クライアント側のロジックには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>

背後にあるコード:

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; }
    }
}

編集:

あなたは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
于 2012-11-06T17:49:38.930 に答える
5

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);
}

マークアップ

       <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>
于 2012-11-06T15:51:43.387 に答える
0
Dim cnt as Integer = 0
For i=0 to GridView1.Rows.Count -1
   Dim chk as CheckBox = TryCast( GridView1.Row(i).Controls.Find("nameOfCheckBoxControlColum"),CheckBox)
if chk.Checked=True Then cnt += 1
Next

'Now cnt holds the number of Checked Boxes.
于 2012-11-06T15:42:56.740 に答える
0
var count = $('input[name="numbChecked"]:checked').length;

トラブルや追加の説明なしでカウントを取得する最も簡単な方法です!:)

于 2014-08-12T18:55:35.040 に答える
0

これはあなたを助けます

function Calculation()
{
    var grid = document.getElementById("<%=grdSelectFees.ClientID%>"); //grdSelectFees GridViewId
    for (var i = 0; i < grid.rows.length - 1 ; i++) 
    {
        var CheckBox1 = $("input[id*=chkRow]")//chkRow Id of Check box
        if (CheckBox1[i].type == "checkbox" && CheckBox1[i].checked)
        {
            //Code For If check Box Is Checked
        }
    }
}
于 2017-06-21T06:38:03.817 に答える