locked
Bootstrap Input Field, MaxLength, Size and Saving to Database C# RRS feed

  • Question

  • User564995064 posted

    Hi all!  I have a form using Bootstrap with asp.net controls (textbox, etc).  I need to now set the textbox size to the maxlength.  I can set the maxlength of the input box and a textbox; however, I need to set the size (width) also.  For instance, I want the social security number input textbox maxlength=11 and the size should be 11 also.  The other issue I am having is how to save the input text to the database.  For the textbox, I use string ssno = txtssno.text;.  However, this does not work with an input in Bootstrap.

    I have included my code.  Thank you for any assistance you can give.

    The code is for part of my form.  I wanted to get a couple of controls working then I can finish the rest.

            protected void Page_Load(object sender, EventArgs e)
            {
            }
    
            protected void btnSubmit_Click(object sender, EventArgs e)
            {
    
                string ssno = txtSSNO.Text;
                //Then this will be calling a class to write to the database.
            }

    <body>
        <form id="form1" data-toggle="validator" role="form">
            <div class="form-group">
    <%--            ****************** Demographic Section ******************--%>
                <div class="col-xs-12">
                    &nbsp;
                </div>
    
    
    
                  <div class="col-xs-4">
                  <label>Social Security Number</label>
                     <asp:TextBox ID="txtSSNO" runat="server" type="text" class="form-control" MaxLength="11" >
                         </asp:TextBox>
                         <input type="text" name="txtSSNO" class="form-control" maxlength="11" size="11">
                 </div>
                <div class="col-xs-4">
                  <label>Email Address</label>
                     <asp:TextBox ID="txtEmail" runat="server" type="email" class="form-control" ></asp:TextBox>
                 </div>
    
                <div class="col-xs-12">
                    &nbsp;
                </div>
    
                <div class="col-xs-5">
                  <label>First Name</label>
                    <asp:TextBox ID="txtfname" runat="server" type="text" class="form-control"></asp:TextBox>
                </div>
                <div class="col-xs-1">
                  <label>MI</label>
                    <asp:TextBox ID="txtmi" runat="server" type="text" class="form-control" MaxLength="1"></asp:TextBox>
                </div>
                <div class="col-xs-5">
                  <label>Last Name</label>
                    <asp:TextBox ID="txtlname" runat="server" type="text" class="form-control"></asp:TextBox>
                </div>
    
                <div class="col-xs-12">
                    &nbsp;
                </div>
    
    
                <div class="col-xs-8">
                    <asp:Button ID="btnSubmit" runat="server" 
                        type="btn btn-lg btn-primary btn-block" class="btn" Text="Submit" 
                        BackColor="#00435B" ForeColor="White" onclick="btnSubmit_Click" />
                </div>
           </div>
        </form>
    
    </body>

    Thursday, September 26, 2019 8:32 PM

All replies

  • User288213138 posted

    Hi rhondadunn,

    rhondadunn

    <form id="form1" data-toggle="validator" role="form">

    Note: The server control must be placed inside a form tag with runat=server

    rhondadunn

      I need to now set the textbox size to the maxlength

    If you want to set the textbox size in Bootstrap, you can use classes like 'col-xs-2' or 'col-xs-3' .

    <div class="col-xs-2">
                    <asp:TextBox ID="txtSSNO" runat="server" type="text" class="form-control" MaxLength="11"></asp:TextBox>
                </div>

    More information about Bootstrap Sizing you can refer to this link:https://www.w3schools.com/bootstrap/bootstrap_forms_sizing.asp

    rhondadunn

    The other issue I am having is how to save the input text to the database.

    You can use Ado.Net to save the data to database. The below code for you as a reference:

    protected void btnSubmit_Click(object sender, EventArgs e)
            {
                string ssno = txtSSNO.Text;
    
                string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
                using (SqlConnection con = new SqlConnection(constr))
                {
                    using (SqlCommand cmd = new SqlCommand("INSERT INTO Test55 VALUES(@Text)"))
                    {
                        cmd.Parameters.AddWithValue("@Text", ssno);
                        cmd.Connection = con;
                        con.Open();
                        cmd.ExecuteNonQuery();
                        con.Close();
                    }
                }
            }

    rhondadunn

    For the textbox, I use string ssno = txtssno.text;.  However, this does not work with an input in Bootstrap

    If you want to get the input value in code behind, you can try below code:

    string name = String.Format("{0}", Request.Form["txtSSNO"]);

    Best regards,

    Sam

    Friday, September 27, 2019 6:01 AM