Hi rani,
Refer below example.
For reading connection string refer below article.
Database
I have made use of table Customers with the schema as follows. CustomerId is an Auto-Increment (Identity) column.
I have already inserted few records in the table.
You can download the database table SQL by clicking the download link below.
Download SQL file
Namespaces
using System.Data;
using System.Data.SqlClient;
using Microsoft.AspNetCore.Mvc;
using Microsoft.Extensions.Configuration;
Model
using System.ComponentModel.DataAnnotations;
namespace Row_Detail_Modal_Core_MVC.Models
{
public class Customer
{
public int Id { set; get; }
public string Name { set; get; }
public string Country { set; get; }
public IEnumerable<Customer> Customers { get; set; }
}
}
Controller
public class HomeController : Controller
{
private IConfiguration Configuration;
public HomeController(IConfiguration _configuration)
{
Configuration = _configuration;
}
private string GetConnectionString()
{
return this.Configuration.GetConnectionString("MyConn");
}
public IActionResult Index()
{
Customer customer = new Customer();
customer.Customers = GetCustomers(null);
return View(customer);
}
[HttpPost]
public IActionResult EditCustomer([FromBody]Customer cust)
{
int id = Convert.ToInt32(cust.Id);
Customer customer = new Customer();
customer.Id = id;
customer.Name = GetCustomers(id).FirstOrDefault().Name;
customer.Country = GetCustomers(id).FirstOrDefault().Country;
customer.Customers = GetCustomers(null);
return PartialView("_PopupPartial", customer);
}
public List<Customer> GetCustomers(int? id)
{
List<Customer> customers = new List<Customer>();
using (SqlConnection con = new SqlConnection(GetConnectionString()))
{
using (SqlCommand cmd = new SqlCommand())
{
cmd.Connection = con;
cmd.CommandType = CommandType.Text;
cmd.Parameters.Clear();
if (id != null)
{
cmd.CommandText = "SELECT * FROM Customers WHERE CustomerId = @Id";
cmd.Parameters.AddWithValue("@Id", id);
}
else
{
cmd.CommandText = "SELECT * FROM Customers";
}
con.Open();
SqlDataReader rdr = cmd.ExecuteReader();
while (rdr.Read())
{
customers.Add(new Customer()
{
Id = Convert.ToInt32(rdr["CustomerId"]),
Name = rdr["Name"].ToString(),
Country = rdr["Country"].ToString()
});
}
con.Close();
}
}
return customers;
}
}
View
Index
@model Row_Detail_Modal_Core_MVC.Models.Customer
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
<script src="~/lib/jquery/dist/jquery.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.js"></script>
<link href="~/lib/bootstrap/dist/css/bootstrap.css" rel="stylesheet" />
<script type="text/javascript">
$(function () {
$("body").on('click', '#btnEdit', function () {
$("#MyPopup").modal("hide");
var obj = {};
obj.Id = $(this).attr('data-id');
$.ajax({
url: 'Home/EditCustomer',
data: JSON.stringify(obj),
type: 'POST',
dataType: 'html',
contentType: "application/json; charset=utf-8",
success: function (response) {
$("#dvPartial").html(response);
$("#MyPopup").modal("show");
}
});
});
});
</script>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-lg-12">
<h4>Customers</h4>
<table class="table table-responsive">
<thead>
<tr>
<th>@Html.DisplayNameFor(model => model.Name)</th>
<th>@Html.DisplayNameFor(model => model.Country)</th>
<th></th>
</tr>
</thead>
<tbody>
@foreach (var customer in Model.Customers)
{
<tr>
<td>@Html.DisplayFor(x => customer.Name)</td>
<td>@Html.DisplayFor(x => customer.Country)</td>
<td>
<a href="#" id="btnEdit" class="btn btn-primary btn-sm" data-id="@customer.Id">Edit</a>
</td>
</tr>
}
</tbody>
</table>
</div>
</div>
</div>
<!-- Modal Popup -->
<div id="MyPopup" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">
×
</button>
<h4 class="modal-title"></h4>
</div>
<div class="modal-body">
<div id="dvPartial"></div>
</div>
<div class="modal-footer">
<input type="button" id="btnClosePopup" value="Close" data-dismiss="modal" class="btn btn-danger" />
</div>
</div>
</div>
</div>
</body>
</html>
PartialView
@addTagHelper*, Microsoft.AspNetCore.Mvc.TagHelpers
@model Row_Detail_Modal_Core_MVC.Models.Customer
<div class="container">
<h4>Customer Details</h4>
<hr />
<div class="row">
<div class="col-md-4">
<form asp-action="Create" asp-controller="Home">
<div class="form-group">
<label asp-for="Id" class="control-label"></label>
<input asp-for="Id" class="form-control" readonly="readonly" />
</div>
<div class="form-group">
<label asp-for="Name" class="control-label"></label>
<input asp-for="Name" class="form-control" readonly="readonly" />
</div>
<div class="form-group">
<label asp-for="Country" class="control-label"></label>
<input asp-for="Country" class="form-control" readonly="readonly" />
</div>
</form>
</div>
</div>
</div>
Screenshot
