ASP.NET WP - Add Data to Database

In this chapter, we will be covering how to create a page that lets users add data to the Customers table in the database.
In this example, you will also understand when the record is inserted, then the page displays the updated table using the ListCustomers.cshtml page that we have created in the previous chapter.
In this example, you will also understand when the record is inserted, then the page displays the updated table using the ListCustomers.cshtml page that we have created in the previous chapter.
In this page, we also add validation to make sure that the data which the user enters is valid for the database. For example, user has entered data for all the required columns.
In this page, we also add validation to make sure that the data which the user enters is valid for the database. For example, user has entered data for all the required columns.
Let’s add a new CSHTML file to your website.
Enter InsertCustomer.cshtml in the Name field and click OK.
Now create a new web page in which the user can insert data in the Customers table, so replace InsertCustomer.cshtml file with the following code.
@{
   Validation.RequireField("FirstName", "First Name is required.");
   Validation.RequireField("LastName", "Last Name is required.");
   Validation.RequireField("Address", "Address is required.");
   
   var db = Database.Open("WebPagesCustomers");
   var FirstName = Request.Form["FirstName"];
   var LastName = Request.Form["LastName"];
   var Address = Request.Form["Address"];
   
   if (IsPost && Validation.IsValid()) {
      // Define the insert query. The values to assign to the
      // columns in the Customers table are defined as parameters
      // with the VALUES keyword.
      
      if(ModelState.IsValid) {
         var insertQuery = "INSERT INTO Customers (FirstName, LastName, Address) " +
            "VALUES (@0, @1, @2)";
         db.Execute(insertQuery, FirstName, LastName, Address);
         
         // Display the page that lists products.
         Response.Redirect("~/ListCustomers");
      }
   }
}

<!DOCTYPE html>
<html>
   
   <head>
      <title>Add Customer</title>
      <style type = "text/css">
         label {
            float:left; 
            width: 8em; 
            text-align: 
            right;
            margin-right: 0.5em;
         }
         fieldset {
            padding: 1em; 
            border: 1px solid; 
            width: 50em;
         }
         legend {
            padding: 2px 4px; 
            border: 1px solid; 
            font-weight:bold;
         }
         .validation-summary-errors {
            font-weight:bold; 
            color:red;
            font-size: 11pt;
         }
      </style>
   
   </head>
   <body>
      <h1>Add New Customer</h1>
      @Html.ValidationSummary("Errors with your submission:")
      
      <form method = "post" action = "">
         <fieldset>
            <legend>Add Customer</legend>
            <div>
               <label>First Name:</label>
               <input name = "FirstName" type = "text" size = "50" value = "@FirstName"/>
            </div>
            
            <div>
               <label>Last Name:</label>
               <input name = "LastName" type = "text" size = "50" value = "@LastName" />
            </div>
            
            <div>
               <label>Address:</label>
               <input name = "Address" type = "text" size = "50" value = "@Address" />
            </div>
            
            <div>
               <label> </label>
               <input type = "submit" value = "Insert" class = "submit" />
            </div>
         </fieldset>
      </form>
   
   </body>
</html>
Now let’s run the application and specify the following url − http://localhost:36905/InsertCustomer and you will see the following web page.
In the above screenshot, you can see that we have added validation, so you click the insert button without entering any data or miss any of the above mentioned field then you will see that it displays the error message as shown in the following screenshot.
Now let’s enter some data in all the fields.
Now click on Insert and you will see the updated list of customers as shown in the following screenshot.

    51 Lectures 
     5.5 hours 

 Anadi Sharma

    44 Lectures 
     4.5 hours 

 Kaushik Roy Chowdhury

    42 Lectures 
     18 hours 

 SHIVPRASAD KOIRALA

    57 Lectures 
     3.5 hours 

 University Code

    40 Lectures 
     2.5 hours 

 University Code

    138 Lectures 
     9 hours 

 Bhrugen Patel
 Print
 Add Notes
 Bookmark this page