Question

我的复选框里面有一个gridview。还有列数量。现在我想要在用户选中复选框时，金额值应显示在下面的文本框中。如果用户检查多行，那么所有金额应该显示在金额文本框中。

如果用户选择gridview第一行＆amp;其金额值为300.然后在文本框下方显示300.或者如果用户选中了2行＆amp;两者都有300,400，然后文本框将显示700的总和。

我尝试使用JQuery代码，但没有太多想法。这就是我想要的。

function GetSelectedCasePartyAmount() {
        var counter = 0;
        $("#<%=gvDepositOrderDetail.ClientID%> input[id*='chkBoxGrdParty']:checkbox").each(function (index) {
        if ($(this).is(':checked'))
            counter++;
    });
    alert(counter);
}

这是我的Gridview＆amp;文本框：

    <asp:GridView ID="gvDepositOrderDetail" runat="server" CssClass="table table-hover table-striped table-bordered"
                    AutoGenerateColumns="false" ShowHeaderWhenEmpty="True" AllowPaging="true"
                    PagerStyle-CssClass="paging" PageSize="10" OnRowDataBound="gvDepositOrderDetail_RowDataBound">
                    <PagerStyle CssClass="gridviewPager" />
                    <RowStyle CssClass="" />
                    <AlternatingRowStyle CssClass="active" />
                    <Columns>
                        <asp:TemplateField>
                            <ItemTemplate>
                                <asp:CheckBox ID="chkBoxGrdParty" runat="server" Checked="false" />
                                <asp:HiddenField ID="hdnDepositOrderId" runat="server" />
                            </ItemTemplate>
                            &lt;HeaderStyle CssClass="text-center" />
                            <ItemStyle CssClass="text-center" />
                        </asp:TemplateField>

                        <asp:TemplateField HeaderText="<%$Resources:ORDER_NO %>">
                            <ItemTemplate>
                                <asp:Label ID="lblOrderNo" runat="server"></asp:Label>
                            </ItemTemplate>
                            &lt;HeaderStyle CssClass="text-center" />
                            <ItemStyle CssClass="text-center" />
                        </asp:TemplateField>

                        <asp:TemplateField HeaderText="<%$ Resources:CASE_PARTY_NAME %>">
                            <ItemTemplate>
                                <asp:Label ID="lblCasePartyName" runat="server"></asp:Label>
                            </ItemTemplate>
                            &lt;HeaderStyle CssClass="text-center" />
                            <ItemStyle CssClass="text-center small-column" />
                        </asp:TemplateField>

                        <asp:TemplateField HeaderText="<%$ Resources:AMOUNT %>">
                            <ItemTemplate>
                                <asp:Label ID="lblAmount" runat="server"></asp:Label>
                            </ItemTemplate>
                            &lt;HeaderStyle CssClass="text-center" />
                            <ItemStyle CssClass="text-center" />
                        </asp:TemplateField>

                        <asp:TemplateField HeaderText="<%$ Resources:DEPOSIT_TYPE %>">
                            <ItemTemplate>
                                <asp:Label ID="lblDeopsitType" runat="server"></asp:Label>
                            </ItemTemplate>
                            &lt;HeaderStyle CssClass="text-center" />
                            <ItemStyle CssClass="text-center" />
                        </asp:TemplateField>

                        <asp:TemplateField HeaderText="<%$ Resources:DEPOSIT_SOURCE %>">
                            <ItemTemplate>
                                <asp:Label ID="lblDepositSource" runat="server"></asp:Label>
                            </ItemTemplate>
                            &lt;HeaderStyle CssClass="text-center" />
                            <ItemStyle CssClass="text-center" />
                        </asp:TemplateField>

                        <asp:TemplateField HeaderText="<%$ Resources:DECISION_DATE %>">
                            <ItemTemplate>
                                <asp:Label ID="lblDecisionDate" runat="server"></asp:Label>
                            </ItemTemplate>
                            &lt;HeaderStyle CssClass="text-center" />
                            <ItemStyle CssClass="text-center" />
                        </asp:TemplateField>

                        <%--       <asp:TemplateField>
                    <ItemTemplate>
                        <asp:LinkButton ID="lnkBtnViewDetail" CausesValidation="false" CommandName="ViewDetail" CssClass="btn btn-primary btn-sm"
                            runat="server"></asp:LinkButton>
                    </ItemTemplate>
                    &lt;HeaderStyle CssClass="text-center" />
                    <ItemStyle CssClass="text-center" />
                </asp:TemplateField>--%>
                    </Columns>
                    <EmptyDataTemplate>
                        <asp:Literal ID="ltrlEmptyData" runat="server" Text="<%$ Resources:Common,EMPTY_DATA_GRID%>"></asp:Literal>
                    </EmptyDataTemplate>
                </asp:GridView>

任何建议真的很感激！

Answer 1

你是一个救星^ _ ^ 我在gridView上有一个复选框列表，我想显示所选支票的数量而不必回发到服务器，这是最佳解决方案：））

       $(document).ready(function () {
           $('*[id^="myCheckBox"]').change(function () {
               var counter = 0;
               $("#<%=gvChecks.ClientID%> input[id*='myCheckBox']:checkbox").each(function  (index) {
                   if ($(this).is(':checked'))
                       counter++;
               });
               var the_label = document.getElementById('lblSelectedCount');
               the_label.textContent = counter;
               //alert(counter);
           })
       });

Answer 2

JQuery代码：

     function gvDepositOrderDetail_OnRowChecked(checkBoxElement, newAmount, targetElement)
    {
        var amountElement = $find(targetElement);
        var amount = amountElement.get_value() == ''? 0 : amountElement.get_value() - 0;
        if (isNaN(amount)) {
            amount = 0;
        }
        if (checkBoxElement.checked == false)
        {
            newAmount = newAmount * -1;
        }
        amount = amount + newAmount;
        amountElement.set_value(amount) ;
    }

代码背后的

：

chk.Attributes.Add("onclick", string.Format("javascript:gvDepositOrderDetail_OnRowChecked(this,{0},'{1}');", lblAmount.Text, txtAmount.ClientID));

如何使用JavaScript / JQuery在Gridview中获取复选框选中的值

2 个答案: