locked
auto generate controls, display them vertically and keep the entries save so that they can start from there RRS feed

  • Question

  • User-1797368610 posted

    Hi,

    In my custom web forms, there is a row  called Guarantor's  Name where i need to give the ability to users so that they can add rows as many they want. initially there rows with Guarantor1, Guarantor2,Guarantor3 with respective text boxes to enter the values for them and they can add more rows if they need to, just clicking add new item button at below.  Please see the Sample Link here the way i want.  Using below code i was able to add rows as many as i want but its displaying horizontally like this.so what i need to change in my code to display guarantor1, guarantor2 and guarantor3 rows vertically along with respective text boxes and they could add more guarantor4, guarantor5 so on? another question is how to add functionality so that users can start the form where they left that means keeps save all previous entries and start from there?

    Thanks in Advanced!

    <tr style="height: 40px">
                                    <td>
                                        <telerik:RadLabel runat="server" ID="RadLabel12" Text="Gurantors Name" AssociatedControlID="RadTextBox2" />
                                        <td style="text-align: left">
                                            <asp:HiddenField ID="HiddenField2" Value="0" runat="server" />
                                            <asp:Table ID="Gurantor_Table" runat="server">
                                                <asp:TableHeaderRow>
                                                    <asp:TableHeaderCell>Gurantor1</asp:TableHeaderCell>
                                                    <asp:TableHeaderCell>Gurantor2</asp:TableHeaderCell>
                                                    <asp:TableHeaderCell>Gurantor3</asp:TableHeaderCell>
                                                </asp:TableHeaderRow>
                                            </asp:Table>
                                            <br />
                                            <asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString="<%$ ConnectionStrings:TelerikConnectionString %>"
                                                SelectCommand="SELECT * FROM [namelist]"></asp:SqlDataSource>
                                            <asp:Button ID="btn_Gurantor" runat="server" Text="add a row" OnClientClick="btn_Gurantor_Click()" />
                                            <script type="text/jscript">
                                                function btn_Gurantor_Click() {
                                                    document.getElementById("<%=HiddenField2.ClientID%>").value = (parseInt(document.getElementById("<%=HiddenField2.ClientID%>").value) + 1).toString();
                                                }
                                            </script>
                                        </td>
                                </tr>
     public partial class Project_Summary : System.Web.UI.Page
        {       
            int rows = 0;
            protected void Page_Load(object sender, EventArgs e)
            {  
               if (HiddenField2.Value != "")
                {
                    rows2 = int.Parse(HiddenField2.Value);
                    for (int i = 0; i < rows2; i++)
                    {
                        TableRow tr = new TableRow();
                        TableCell tc = new TableCell();
                        TextBox tb1 = new TextBox();
                        tb1.ID = "Guarantor1" + i.ToString();
                        TableCell tc1 = new TableCell();
                        tc1.Controls.Add(tb1);
                        TextBox tb2 = new TextBox();
                        tb2.ID = "Guarantor2" + i.ToString();
                        TableCell tc2 = new TableCell();
                        tc2.Controls.Add(tb2);
                        TextBox tb3 = new TextBox();
                        tb3.ID = "Guarantor3" + i.ToString();
                        TableCell tc3 = new TableCell();
                        tc3.Controls.Add(tb3);
    
                        tr.Cells.Add(tc1);
                        tr.Cells.Add(tc2);
                        tr.Cells.Add(tc3);
                        Gurantor_Table.Rows.Add(tr);
                    }
                }

    Tuesday, June 2, 2020 4:42 PM

Answers

  • User-943250815 posted

    You are creating multiple table cells on same row.
    To achieve what you want, you have to add a new table row and table cell for each Guarantor

    for (int i = 0; i < rows2; i++)
        {
            TableRow tr;
            TableCell tc;
    
            tr = new TableRow();
            tc = new TableCell();
            TextBox tb1 = new TextBox();
            tb1.ID = "Guarantor1" + i.ToString();
            tc.Controls.Add(tb1);
            tr.Controls.Add(tc);
            Gurantor_Table.Rows.Add(tr);
    
            tr = new TableRow();
            tc = new TableCell();
            TextBox tb2 = new TextBox();
            tb2.ID = "Guarantor2" + i.ToString();
            tc.Controls.Add(tb2);
            tr.Controls.Add(tc);
            Gurantor_Table.Rows.Add(tr);
    
            tr = new TableRow();
            tc = new TableCell();
            TextBox tb3 = new TextBox();
            tb3.ID = "Guarantor3" + i.ToString();
            tc.Controls.Add(tb3);
            tr.Controls.Add(tc);
            Gurantor_Table.Rows.Add(tr);
        }
    

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, June 2, 2020 7:25 PM

All replies

  • User-943250815 posted

    You are creating multiple table cells on same row.
    To achieve what you want, you have to add a new table row and table cell for each Guarantor

    for (int i = 0; i < rows2; i++)
        {
            TableRow tr;
            TableCell tc;
    
            tr = new TableRow();
            tc = new TableCell();
            TextBox tb1 = new TextBox();
            tb1.ID = "Guarantor1" + i.ToString();
            tc.Controls.Add(tb1);
            tr.Controls.Add(tc);
            Gurantor_Table.Rows.Add(tr);
    
            tr = new TableRow();
            tc = new TableCell();
            TextBox tb2 = new TextBox();
            tb2.ID = "Guarantor2" + i.ToString();
            tc.Controls.Add(tb2);
            tr.Controls.Add(tc);
            Gurantor_Table.Rows.Add(tr);
    
            tr = new TableRow();
            tc = new TableCell();
            TextBox tb3 = new TextBox();
            tb3.ID = "Guarantor3" + i.ToString();
            tc.Controls.Add(tb3);
            tr.Controls.Add(tc);
            Gurantor_Table.Rows.Add(tr);
        }
    

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, June 2, 2020 7:25 PM
  • User-1797368610 posted

    Hi Jzero,

    Thanks for your reply. i was able to make rows vertically but guarantor's name still displaying at the top. i want to display each of the guarantor left side of their textboxs like this and some space in between textboxes. would it be possible to display three guarantor's when they open the forms and if they want to add more guarantors they can add clicking the Add button? and obviously we need to save all guarantor's values to database.

    Note: As i asked in my previous post, is there a way user can start the form where they left means let's say they entered few guarantor's name and think they will complete later. can they start the form without entering previous guarantors using session variables or cookies? hope i was able to explain properly.

    Thanks in advanced!

    Wednesday, June 3, 2020 4:01 PM
  • User-943250815 posted

    I did not pay proper attention on your layout and code, here is a reviewed version.
    You can use nested tables, and create rows and cells on nested table.

    <asp:Button ID="Button1" runat="server" Text="Button" />
    <asp:Table ID="MainTable" runat="server" BackColor="#CCCCCC" CellPadding="10" BorderColor="#0033CC" BorderStyle="Solid" BorderWidth="2px" GridLines="Both" > <asp:TableRow> <asp:TableCell RowSpan="2" BackColor="#CCFF33"> Guarantors Name(s) </asp:TableCell> <asp:TableCell> <asp:Table ID="Gurantor_Table" runat="server" BackColor="#FFFFCC" BorderColor="Black" BorderStyle="Solid" BorderWidth="1px" CellPadding="5" GridLines="Both"> </asp:Table> </asp:TableCell> </asp:TableRow> <asp:TableRow> <asp:TableCell BackColor="#99CCFF"> Add more rows as needed </asp:TableCell> </asp:TableRow> </asp:Table>

    On code behind

    protected void Button1_Click(object sender, EventArgs e)
    {
        int QtRows = 4;
        for (int i = 1; i <= QtRows; i++)
        {
            TableRow tr = new TableRow();
            TableCell tc0 = new TableCell();
            TableCell tc1 = new TableCell();
            TextBox tb1 = new TextBox();
            string id = "Guarantor" + i.ToString();
            tb1.ID = id;
            tc0.Text = id;
            tc1.Controls.Add(tb1);
            tr.Controls.Add(tc0);
            tr.Controls.Add(tc1);
            Gurantor_Table.Rows.Add(tr);
        }
    }
    

    can they start the form without entering previous guarantors using session variables or cookies? hope i was able to explain properly.

    I think your best choice is store such temporary data in a table, you can restore data from table and fill the form, anyway you have to place a button like "Store & Continue Later"
    Session does not work, as soon it expires or user leave page or close browser, all values in session are gone.
    Using Cookie, to looks it is not gone work, just because user can move to another computer. And cookie will not be there....

    Wednesday, June 3, 2020 8:55 PM
  • User-1797368610 posted

    Appreciated Jzero for your help on this. Now i am receiving error at the Gurantor3 find controls "Specified argument was out of the range of valid values. Parameter name: index"  when trying to save into sql database.  what i need to change to get rid of this error? still would i be able to add as many guarantors as i want  and save them into sql database using below code? 

    Note: Guarantor's Name is one of the row in web forms.

    Thanks

                            <tr style="height: 40px">
                                    <td>
                                        <telerik:RadLabel runat="server" ID="RadLabel19" Text="Gurantors Name" AssociatedControlID="RadTextBox2" />
                                        <td style="text-align: left">
                                            <asp:Table ID="MainTable" runat="server" BackColor="#CCCCCC" CellPadding="10" BorderColor="#0033CC" BorderStyle="Solid" BorderWidth="2px" GridLines="Both" >
                                                <asp:TableRow>                                                
                                                    <asp:TableCell>
                                                        <asp:HiddenField ID="HiddenField4" Value="4" runat="server" />
                                                      <asp:Table ID="Gurantor_Table" runat="server" BackColor="#FFFFCC" BorderColor="Black" BorderStyle="Solid" BorderWidth="1px" CellPadding="5" GridLines="Both">
                                                      </asp:Table>
                                                    </asp:TableCell>
                                                </asp:TableRow>
                                                </asp:Table>                                        
                                            <br />                                      
                                            <asp:Button ID="Button1" runat="server" Text="add a row" OnClientClick="btn_Gurantor_Click()" />
                                            <script type="text/jscript">
                                                function btn_Gurantor_Click() {
                                                    document.getElementById("<%=HiddenField4.ClientID%>").value = (parseInt(document.getElementById("<%=HiddenField4.ClientID%>").value) + 1).toString();
                                                }
                                            </script>
                                        </td>
                                </tr>
     public partial class Project_Summary : System.Web.UI.Page
    {
    int QtRows = 4;
    protected void Page_Load(object sender, EventArgs e)
    {
    if (HiddenField4.Value != "") { QtRows = int.Parse(HiddenField4.Value); for (int i = 1; i <QtRows; i++) { TableRow tr = new TableRow(); TableCell tc0 = new TableCell(); TableCell tc1 = new TableCell(); TextBox tb1 = new TextBox(); string id = "Guarantor " + i.ToString(); tb1.ID = id; tc0.Text = id; tc1.Controls.Add(tb1); tr.Controls.Add(tc0); tr.Controls.Add(tc1); Gurantor_Table.Rows.Add(tr); } }
    protected void RadWizard1_FinishButtonClick(object sender, WizardEventArgs e)
    {
    if (e.NextStepIndex == 3)
    {
    uploadfiles();
    }
    }
    protected void uploadfiles()
    {
    SqlConnection sqlcon = new SqlConnection();
    sqlcon.ConnectionString = @"Data Source=Database;Initial Catalog=Developer_Form;Integrated Security=True";
    SqlCommand sqlcom = new SqlCommand();
    sqlcom.Connection = sqlcon;
    for (int i = 0; i < rows; i++)
    {
    sqlcom.Parameters.Clear();
    TextBox tb7 = Gurantor_Table.Rows[i].Cells[0].FindControl("guarantor1" + i.ToString()) as TextBox;
    TextBox tb8 = Gurantor_Table.Rows[i].Cells[1].FindControl("guarantor2" + i.ToString()) as TextBox;
    TextBox tb9 = Gurantor_Table.Rows[i].Cells[2].FindControl("guarantor3" + i.ToString()) as TextBox;
    sqlcom.Parameters.AddWithValue("@guarantor1", tb7.Text);
    sqlcom.Parameters.AddWithValue("@guarantor2", tb8.Text);
    sqlcom.Parameters.AddWithValue("@guarantor3", tb9.Text);
    sqlcon.Open();
    sqlcom.ExecuteNonQuery();
    sqlcon.Close();
    }
    Gurantor_Table.Rows.Clear();
    }

    Thursday, June 4, 2020 3:35 PM
  • User-943250815 posted

    Index out of range, is because page has only a table without rows and cell.
    Working with Dynamic Web Controls is not so simple as you may think, controls should be placed on page at right time, you can see controls on page, but they are not part of Page ViewState.
    You can have a detailed explanation here http://www.4guysfromrolla.com/articles/092904-1.aspx
    And some other samples
    http://geekswithblogs.net/shahed/archive/2008/06/26/123391.aspx
    http://geekswithblogs.net/dotNETvinz/archive/2009/06/29/faq-dynamically-adding-rows-in-asp-table-on-button-click.aspx

    Hope this guide you in right direction

    Friday, June 5, 2020 7:04 PM