How to Insert Multiple Row in Asp.Net Core MVC

sql code :

CREATE TABLE [dbo].[Customers](
[CustomerId] [int] NOT NULL,
[Name] [varchar](100) NOT NULL,
[Country] [varchar](50) NOT NULL
) ON [PRIMARY]

Controller code:

public class HomeController : Controller
{
// GET: Home
public ActionResult Index()
{
CustomersEntities entities = new CustomersEntities();
return View(entities.Customers);
}
public JsonResult InsertCustomers(List customers)
{
using (CustomersEntities entities = new CustomersEntities())
{
//Truncate Table to delete all old records.
entities.Database.ExecuteSqlCommand("TRUNCATE TABLE [Customers]");
//Check for NULL.
if (customers == null)
{
customers = new List();
}
//Loop and insert records.
foreach (Customer customer in customers)
{
entities.Customers.Add(customer);
}
int insertedRecords = entities.SaveChanges();
return Json(insertedRecords);
}
}
}

View

@model IEnumerable<Insert_Multiple_Rows_EF_MVC.Customer>
@{
Layout = null;
}
>
<html>
<head>
<meta name="viewport" content="width=device-width"/>
<title>Indextitle>
head>
<body>
<table id="tblCustomers" class="table" cellpadding="0" cellspacing="0">
<thead>
<tr>
<th style="width:150px">Nameth>
<th style="width:150px">Countryth>
<th>th>
tr>
thead>
<tbody>
@foreach (Customer customer in Model)
{
<tr>
<td>@customer.Nametd>
<td>@customer.Countrytd>
<td><input type="button" value="Remove" onclick="Remove(this)"/>td>
tr>
}
tbody>
<tfoot>
<tr>
<td><input type="text" id="txtName"/>td>
<td><input type="text" id="txtCountry"/>td>
<td><input type="button" id="btnAdd" value="Add"/>td>
tr>
tfoot>
table>
<br/>
<input type="button" id="btnSave" value="Save All"/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">script>
<script type="text/javascript" src="http://ajax.cdnjs.com/ajax/libs/json2/20110223/json2.js">script>
<script type="text/javascript">
$("body").on("click", "#btnAdd", function () {
//Reference the Name and Country TextBoxes.
var txtName = $("#txtName");
var txtCountry = $("#txtCountry");
//Get the reference of the Table's TBODY element.
var tBody = $("#tblCustomers > TBODY")[0];
//Add Row.
var row = tBody.insertRow(-1);
//Add Name cell.
var cell = $(row.insertCell(-1));
cell.html(txtName.val());
//Add Country cell.
cell = $(row.insertCell(-1));
cell.html(txtCountry.val());
//Add Button cell.
cell = $(row.insertCell(-1));
var btnRemove = $("<input />");
btnRemove.attr("type", "button");
btnRemove.attr("onclick", "Remove(this);");
btnRemove.val("Remove");
cell.append(btnRemove);
//Clear the TextBoxes.
txtName.val("");
txtCountry.val("");
});
function Remove(button) {
//Determine the reference of the Row using the Button.
var row = $(button).closest("TR");
var name = $("TD", row).eq(0).html();
if (confirm("Do you want to delete: " + name)) {
//Get the reference of the Table.
var table = $("#tblCustomers")[0];
//Delete the Table row using it's Index.
table.deleteRow(row[0].rowIndex);
}
};
$("body").on("click", "#btnSave", function () {
//Loop through the Table rows and build a JSON array.
var customers = new Array();
$("#tblCustomers TBODY TR").each(function () {
var row = $(this);
var customer = {};
customer.Name = row.find("TD").eq(0).html();
customer.Country = row.find("TD").eq(1).html();
customers.push(customer);
});
//Send the JSON array to Controller using AJAX.
$.ajax({
type: "POST",
url: "/Home/InsertCustomers",
data: JSON.stringify(customers),
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (r) {
alert(r + " record(s) inserted.");
}
});
});
script>
body>
html>

4 Replies

Know the answer? Post it — somebody with the same question will find it here.

Bidyasagar Mishra7y ago
yup junaid, thanks for inform me
0
Junaid Shahid7y ago
The code of @ Bidyasagar Mishra
is nice but you can use the optimized one chunk.

entities.Customers.AddRange(customers);
0
Bidyasagar Mishra7y ago
sql code :
CREATE TABLE [dbo].[Customers](
    [CustomerId] [int] NOT NULL,
    [Name] [varchar](100) NOT NULL,
    [Country] [varchar](50) NOT NULL
) ON [PRIMARY]
Controller code:
public class HomeController : Controller
{
    // GET: Home
    public ActionResult Index()
    {
        CustomersEntities entities = new CustomersEntities();
        return View(entities.Customers);
    }

    public JsonResult InsertCustomers(List customers)
    {
        using (CustomersEntities entities = new CustomersEntities())
        {
            //Truncate Table to delete all old records.
            entities.Database.ExecuteSqlCommand("TRUNCATE TABLE [Customers]");

            //Check for NULL.
            if (customers == null)
            {
                customers = new List();
            }

            //Loop and insert records.
            foreach (Customer customer in customers)
            {
                entities.Customers.Add(customer);
            }
            int insertedRecords = entities.SaveChanges();
            return Json(insertedRecords);
        }
    }
}
View
@model IEnumerable<Insert_Multiple_Rows_EF_MVC.Customer>

@{
    Layout = null;
}

>

<html>
<head>
    <meta name="viewport" content="width=device-width"/>
    <title>Indextitle>
head>
<body>
    <table id="tblCustomers" class="table" cellpadding="0" cellspacing="0">
        <thead>
            <tr>
                <th style="width:150px">Nameth>
                <th style="width:150px">Countryth>
                <th>th>
            tr>
        thead>
        <tbody>
            @foreach (Customer customer in Model)
            {
                <tr>
                    <td>@customer.Nametd>
                    <td>@customer.Countrytd>
                    <td><input type="button" value="Remove" onclick="Remove(this)"/>td>
                tr>
            }
        tbody>
        <tfoot>
            <tr>
                <td><input type="text" id="txtName"/>td>
                <td><input type="text" id="txtCountry"/>td>
                <td><input type="button" id="btnAdd" value="Add"/>td>
            tr>
        tfoot>
    table>
    <br/>
    <input type="button" id="btnSave" value="Save All"/>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">script>
    <script type="text/javascript" src="http://ajax.cdnjs.com/ajax/libs/json2/20110223/json2.js">script>
    <script type="text/javascript">
        $("body").on("click", "#btnAdd", function () {
            //Reference the Name and Country TextBoxes.
            var txtName = $("#txtName");
            var txtCountry = $("#txtCountry");

            //Get the reference of the Table's TBODY element.
            var tBody = $("#tblCustomers > TBODY")[0];

            //Add Row.
            var row = tBody.insertRow(-1);

            //Add Name cell.
            var cell = $(row.insertCell(-1));
            cell.html(txtName.val());

            //Add Country cell.
            cell = $(row.insertCell(-1));
            cell.html(txtCountry.val());

            //Add Button cell.
            cell = $(row.insertCell(-1));
            var btnRemove = $("<input />");
            btnRemove.attr("type", "button");
            btnRemove.attr("onclick", "Remove(this);");
            btnRemove.val("Remove");
            cell.append(btnRemove);

            //Clear the TextBoxes.
            txtName.val("");
            txtCountry.val("");
        });

        function Remove(button) {
            //Determine the reference of the Row using the Button.
            var row = $(button).closest("TR");
            var name = $("TD", row).eq(0).html();
            if (confirm("Do you want to delete: " + name)) {
                //Get the reference of the Table.
                var table = $("#tblCustomers")[0];

                //Delete the Table row using it's Index.
                table.deleteRow(row[0].rowIndex);
            }
        };

        $("body").on("click", "#btnSave", function () {
            //Loop through the Table rows and build a JSON array.
            var customers = new Array();
            $("#tblCustomers TBODY TR").each(function () {
                var row = $(this);
                var customer = {};
                customer.Name = row.find("TD").eq(0).html();
                customer.Country = row.find("TD").eq(1).html();
                customers.push(customer);
            });

            //Send the JSON array to Controller using AJAX.
            $.ajax({
                type: "POST",
                url: "/Home/InsertCustomers",
                data: JSON.stringify(customers),
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (r) {
                    alert(r + " record(s) inserted.");
                }
            });
        });
    script>
body>
html>
+1
Rajanikant Hawaldar7y ago
Hi Chittaranjan,
http://demo.dotnetawesome.com/mvc/insert-multiple-record-to-database-at-a-time-aspnet-mvc4
http://www.dotnetawesome.com/2014/08/how-to-insert-multiple-record-to-database-at-a-time-aspnet-mvc4.html
https://www.codeproject.com/Questions/676067/insert-multiple-row-in-mvc
https://www.webcodeexpert.com/2015/12/sqlbulkcopy-to-insert-multiple-records.html
+1