Question

我在gridview中动态添加了n个文本框，并将数据绑定在上。如果用户在任何文本框中更改值，我想要一个函数/方法后面的代码来汇总textbox1，textbox2 ..... textboxn在 textboxtotal 。我无法使用这些文本框添加回发，因为在回发文本框后会被处理掉。

动态地将列添加到Gridview的代码

  foreach (string a in crcl)
            {

                SqlCommand cmd1 = new SqlCommand("select qty from purchaseinstruction where project ='" + DropDownList1.SelectedItem.ToString() + "' AND circle = '" + a + "' AND item = 'BIFURCATION' AND material = '" + mat + "'", agr);
                SqlDataReader dr1 = cmd1.ExecuteReader();
                if (dr1.Read())
                {
                    string val = dr1[0].ToString();
                    if (val.Length > 0)
                    {
                        row[a] = val;
                        value = value + decimal.Parse(val);
                    }
                    else
                    {
                        row[a] = 0;
                    }
                }
                else
                {
                    row[a] = 0;
                }
                dr1.Dispose();
                row["TOTAL"] = value;
            }                
            dt.Rows.Add(row);
 GridView1.DataSource = dt;
        GridView1.DataBind();

在rowbound上添加Textbox控件：

 protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
    int i = 3;
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        crcl = (List<string>)ViewState["bdi2"];
        foreach(string a in crcl)
        {
            TextBox TextBox101 = new TextBox();
            TextBox101.ID=a;
            TextBox101.Width = 60;
            TextBox101.Text = (e.Row.DataItem as DataRowView).Row[a].ToString();
            e.Row.Cells[i].Controls.Add(TextBox101);
            i++;
        }
        TextBox TextBox102 = new TextBox();
        TextBox102.ID = "TOTAL";
        TextBox102.Width = 60;
        TextBox102.Text = (e.Row.DataItem as DataRowView).Row["TOTAL"].ToString();
        e.Row.Cells[i].Controls.Add(TextBox102);
    }
}

Answer 1

您可以在后面的代码中创建Javascript函数，如下所示（如果您使用的是WebForms）：

string myScript = "function sumTextBoxes() { var arr = document.getElementsByClassName('txtBox');\n";
       myScript += "var total=0;\n";
       myScript += "for(var i=0;i<arr.length;i++){\n";
       myScript += "if(parseInt(arr[i].value))\n";
       myScript += "total += parseInt(arr[i].value);}\n";
       myScript += "document.getElementById('total').value = total;}\n";
Page.ClientScript.RegisterStartupScript(this.GetType(), "myKey", myScript, true);

现在，将css类添加到动态创建的TextBoxes中（添加此项）：

TextBox101.CssClass = "txtBox";

此外，显示总和的TextBox应如下命名：

TextBox102.ID = "total";

Answer 2

这是一个让你入门的小例子。为GridView中的TextBoxes添加一个唯一的类名。然后jQuery可以将onblur事件绑定到它们。

<asp:GridView ID="GridView1" runat="server">
    <Columns>
        <asp:TemplateField>
            <ItemTemplate>
                <asp:TextBox ID="TextBox1" runat="server" CssClass="GridTextBox"></asp:TextBox>
                <asp:TextBox ID="TextBox2" runat="server" CssClass="GridTextBox"></asp:TextBox>
                <asp:TextBox ID="TextBox3" runat="server" CssClass="GridTextBox"></asp:TextBox>
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>

这里是TextBox失去焦点时调用的javascript函数。首先，触发事件的TextBox的ID被拆分为多个部分，以获取行中其他两个TextBox的ID（在我的情况下，ID看起来像这个ContentPlaceHolder1_GridView1_TextBox1_0）。然后，只需添加值即可。

<script type="text/javascript">
    $(document).ready(function () {
        $('.GridTextBox').blur(function () {
            var idString = this.id.split("_");
            var tb1 = idString[0] + "_" + idString[1] + "_TextBox1_" + idString[3];
            var tb2 = idString[0] + "_" + idString[1] + "_TextBox2_" + idString[3];
            var tb3 = idString[0] + "_" + idString[1] + "_TextBox3_" + idString[3];
            var total = parseInt($("#" + tb1).val()) + parseInt($("#" + tb2).val());
            if (!isNaN(total)) {
                $("#" + tb3).val(total);
            }
        });
    });
</script>

如何将数据从文本框复制到另一个文本框，在gridview中动态添加，无需回发

2 个答案: