代码之家 › 专栏 › 技术社区 › Ercan Celik

如何在不回发的情况下更新网格视图中的标签(按TemplateField)复选框

asp.net-ajax checkbox gridview asp.net

0

Ercan Celik · 技术社区 · 11 年前

我有一个网格视图,每行的第一列都有一个复选框。我将datagridview绑定到账单的数据源。我想显示在网格视图之外的标签上选中的账单总额。而且我不希望复选框进行回发。我尝试用javascript(asp:checkbox的onclick事件)实现这一点,但未能实现。我也尝试了AjaxControlToolkit,但再次失败。

请帮忙。

<asp:GridView runat="server" ID="GridView1" AutoGenerateColumns="False" Width="100%"
                    CssClass="gv">
                    <Columns>
                        <asp:TemplateField HeaderText="SeÃ§" HeaderStyle-Width="50px">
                            <ItemTemplate>
                                <asp:CheckBox ID="chkRow" runat="server" Checked="false"/>
                            </ItemTemplate>
                            <HeaderStyle HorizontalAlign="Center" />
                            <ItemStyle HorizontalAlign="Center" />
                        </asp:TemplateField>
                        <asp:BoundField DataField="InvoiceDate" HeaderText="Fatura Tarihi" DataFormatString="{0:dd-MM-yyyy}">
                            <HeaderStyle HorizontalAlign="Center" />
                            <ItemStyle HorizontalAlign="Center" />
                        </asp:BoundField>
                        <asp:BoundField DataField="Amount" HeaderText="Tutar" DataFormatString="{0:N2} TL">
                            <HeaderStyle HorizontalAlign="Right" />
                            <ItemStyle HorizontalAlign="Right" />
                        </asp:BoundField>
 </Columns>
                </asp:GridView>

1 回复 | 直到 11 年前

1

Amit Kumar 11 年前

正如您所提到的,您也尝试了JS作为解决方案。所以我在JS中发布你的解决方案。我以为你标签身份证件 磅/平方英寸 (此处要显示相应列名Tutar的总和)。您的标签

<asp:Label ID="lbl" runat="server"></asp:Label>

您只需要在复选框中添加一个类。我用过 mychk公司 . 所以复选框的代码如下

Columns>
     <asp:TemplateField HeaderText="SeÃ§" HeaderStyle-Width="50px">
         <ItemTemplate>
             <asp:CheckBox ID="chkRow" runat="server" Checked="false" class="mychk" />
          </ItemTemplate>
    </asp:TemplateField>

您的jquery将是

<script type="text/javascript">
        $(document).ready(function () {
            var sum = parseInt($('#lbl').html()) || 0;
            $('.mychk input[type="checkbox"]').on('change', function () {
                if ($(this).is(':checked')) {
                    sum += parseInt($(this).closest('tr').find('td:eq(2)').html()) || 0;
                } else {
                    sum -= parseInt($(this).closest('tr').find('td:eq(2)').html()) || 0;
                }
                $('#lbl').html(sum);
            });
        }); 
</script>

当你 check 或 uncheck 这个 checkboxes