Question

我希望能够在数量文本框中输入值，然后：

将该值乘以“Unit Square Foot”并将结果存储到“Subtotal”
将每个小计求和并将结果存储到“总计”

这是我到目前为止所做的：

           <asp:GridView runat="server" ID="gridViewBuildOfficeSpace" AllowPaging="false" 
                AllowSorting="false" AutoGenerateDeleteButton="false" 
                AutoGenerateEditButton="false" AutoGenerateSelectButton="false" 
                AutoGenerateColumns="false" ShowFooter="true" 
               onrowdatabound="gridViewBuildOfficeSpace_RowDataBound">
                <Columns>
                    <asp:BoundField DataField="Description" HeaderText="Description" />
                    <asp:BoundField DataField="Size" HeaderText="Size" />
                    <asp:BoundField DataField="Dimensions" HeaderText="Dimensions" />
                    <asp:TemplateField HeaderText="Unit Square Foot">
                        <ItemTemplate>
                            <asp:Label runat="server" ID="unitSquareFootLabel" Text='<%# Eval("UnitSquareFoot") %>'  />
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="Quantity" >
                        <ItemTemplate>
                            <asp:TextBox AutoPostBack="true" ID="gridviewQuantityItem" runat="server"/>
                        </ItemTemplate>
                        <FooterTemplate>
                            <asp:Label ID="Label12" Text="Total Size: " runat="server" />
                        </FooterTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="SubTotal">
                        <ItemTemplate>
                            <asp:Label ID="gridViewItemSubTotal"  runat="server" />
                        </ItemTemplate>
                        <FooterTemplate>
                            <asp:Label ID="totalSizeDisplayLabel" runat="server" />
                        </FooterTemplate>
                    </asp:TemplateField>
                </Columns>
            </asp:GridView>
        </div>

代码背后：

        protected void gridViewBuildOfficeSpace_RowDataBound(object sender, GridViewRowEventArgs e)
    {

        for (int i = 0; i < gridViewBuildOfficeSpace.Rows.Count; i++)
        {
            gridViewBuildOfficeSpace.Rows[i].Cells[5].Text = Convert.ToString(Convert.ToDouble(gridViewBuildOfficeSpace.Rows[i].Cells[3].Text)*Convert.ToDouble(gridViewBuildOfficeSpace.Rows[i].Cells[4].Text)); 
        }
    }

我尝试在TextBox，OnTextChanged中使用，然后尝试找到相关的控件将它们转换为整数并将它们相乘并将值显示到标签中但我得到关于unitSquareFootLabel的空引用。

但是使用上面的代码我得到的输入字符串格式不正确。

我该怎么做？

Answer 1

您有2个选项。

使用jQuery或javascript
使用c＃在后端执行它们（包括刷新页面）

我推荐第一个选项。这是一个例子：所以gridview需要稍微修改一下。我添加了一些可以用JS和jQuery轻松引用的css类名：

<asp:GridView runat="server" ID="gridViewBuildOfficeSpace" 
    AutoGenerateColumns="False" ShowFooter="True"
    DataSourceID="SqlDataSource1">
    <Columns>
        <asp:BoundField DataField="DESCRIPTION" HeaderText="Description" />
        <asp:BoundField DataField="SIZE" HeaderText="Size" />
        <asp:BoundField DataField="DIMENSIONS" HeaderText="Dimensions" />
        <asp:TemplateField HeaderText="Unit Square Foot">
            <ItemTemplate>
                <asp:Label runat="server" ID="unitSquareFootLabel" Text='<%# Eval("SQFOOT") %>'  />
            </ItemTemplate>
            <ItemStyle CssClass="unitSquareFoot" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Quantity" >
            <ItemTemplate>
                <asp:TextBox ID="gridviewQuantityItem" runat="server" onblur="calculate()"/>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="Label12" Text="Total Size: " runat="server" />
            </FooterTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="SubTotal">
            <ItemTemplate>
                <asp:Label ID="gridViewItemSubTotal"  runat="server" />
            </ItemTemplate>
            <ItemStyle CssClass="SubTotal" />
            <FooterTemplate>
                <asp:Label ID="totalSizeDisplayLabel" runat="server" />
            </FooterTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>

然后在页面底部，在结束体标记之前，添加此js：

<script>
    function calculate() {
        //get the gridview
        gv = $('#gridViewBuildOfficeSpace');
        //Find the number of rows in the grid
        var rowCount = gv.find('tr').length;

        //Iterate through each row looking for the input boxes (This section is for the ROW totals)
        for (var i = 0; i < rowCount; i++) {
        //Iterate through each text box
            var row = gv.find("tr:eq(" + i + ")");
            //Find the input text field
            row.find(":input[type=text]").each(function () {
                //Get the quantity value
                quantity = $(this).val();
                //Get the sqfoot
                sqfoot = row.find("[class$='unitSquareFoot']").text();
                //Add the text to the subtotal field
                row.find("[class$='SubTotal']").text(quantity * sqfoot);
            });
        }
    }
</script>

这假设您添加对jQuery的引用以使其工作...

如何将两个GridView列合二为一

1 个答案: