locked
Add Table Row From Botton Click RRS feed

  • Question

  • User-812117547 posted

    I am using the below C# syntax to dynamically generate a table row.  What I need is to now add a button that when the user presses a button it will add a new row that mirrors the current set-up.  How would this be achieved?

    protected void btnGreen_Click(object sender, EventArgs e)
    {
    StringBuilder sb = new StringBuilder(string.Empty);
    sb.Append("<table>");
    sb.Append("<tr>");
    sb.Append("<th>Spl</th>");
    foreach (System.Web.UI.WebControls.ListItem item in cbxTest.Items)
    {

    if (item.Selected) { sb.Append("<th>" + columnname + "</th>"); }
    }
    sb.Append("</tr>");
    int z = 2;
    sb.Append("<td><input type=\"text\" name=\"field1\"></td>");
    foreach (System.Web.UI.WebControls.ListItem item in cbxTest.Items)
    {
    if(item.Selected) { sb.Append("<td><input type=\"text\" name=\"field " + z + "\"></td>"); }
    z = z + 1;
    }
    sb.Append("</tr>");
    sb.Append("</table>");
    other.InnerHtml = sb.ToString();
    }

    Wednesday, January 31, 2018 3:55 PM

Answers

  • User-707554951 posted

    Hi RahidBalaba

    Are you want something as below?

     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script>
        $(document).ready(function () {
            $("#Button1").click(function () {
                var originalrow = $("#other").find("tr").eq(1).html();
                $("#other").find("tr:last").after("<tr>" + originalrow + "</tr>");
                return false;
        })
    });
    </script>
    div>
            <asp:Button ID="btnGreen" runat="server" Text="Button"  OnClick="btnGreen_Click"/>
            <asp:Button ID="Button1" runat="server" Text="NewButton" />
        </div>
            <div id="other" runat="server"> </div>

    CodeBehind:

       protected void btnGreen_Click(object sender, EventArgs e)
            {
                StringBuilder sb = new StringBuilder(string.Empty);
                sb.Append("<table>");
                sb.Append("<tr>");
                sb.Append("<th>Spl</th>");
                List<ListItem> cbxTest = new List<ListItem>();
                cbxTest.Add(new ListItem { Value = "Value0", Text = "Text1" });
                cbxTest.Add(new ListItem { Value = "Value1", Text = "Text2",Selected=true });
                cbxTest.Add(new ListItem { Value = "Value2", Text = "Text3"  });
                foreach (System.Web.UI.WebControls.ListItem item in cbxTest)
                {
    
                    if (item.Selected) { sb.Append("<th>" + item.Text + "</th>"); }
                }
                sb.Append("</tr>");
                int z = 2;
                sb.Append("<td><input type=\"text\" name=\"field1\"></td>");
                foreach (System.Web.UI.WebControls.ListItem item in cbxTest)
                {
                    if (item.Selected) { sb.Append("<td><input type=\"text\" name=\"field " + z + "\"></td>"); }
                    z = z + 1;
                }
                sb.Append("</tr>");
                sb.Append("</table>");
                other.InnerHtml = sb.ToString();
            }

    Output:

    What I need is to now add a button that when the user presses a button it will add a new row that mirrors the current set-up.

    if not, would you please show us with more details about following description above?


    Best regards

    Cathy

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, February 1, 2018 2:29 AM