How to Display Details in Bootstrap Modal popup in MVC

Ramesh Sir ::-

List Method And Details Method :-

[HttpGet]

public ActionResult ContactUsList()

{

var contactus = db.ContactUs.ToList();

return View(contactus);

}

[HttpGet]

public ActionResult Details(long id)

{

var contactus = db.ContactUs.Find(id);

//return View(contactus);

return PartialView("_Details", contactus);

}

List Page View :-

@model IEnumerable

ViewBag.Title = "ContactUs List";

Layout = "~/Views/Shared/_HomeLayout.cshtml";

var grid = new WebGrid(source: Model, canSort: true, rowsPerPage: 15);

grid.Pager(WebGridPagerModes.All);

int firstRecord = (grid.PageIndex * grid.RowsPerPage) + 1;

int lastRecord = (grid.PageIndex * grid.RowsPerPage) + grid.Rows.Count();

}

ContactUs List

@grid.GetHtml(

tableStyle: "table table-responsive backcolor table-striped table-bordered table-hover",

headerStyle: "wedgrid-header",

footerStyle: "webgrid-footer",

alternatingRowStyle: "webgrid-alternating-row",

rowStyle: "webgrid-row-style",

columns:

grid.Columns

(

grid.Column("ContactUsId", "ContactUs Id", canSort: false),

grid.Column("Name", "Full Name", canSort: false),

grid.Column("PhoneNo", "Phone Number", canSort: false),

grid.Column("Type", "Message Type", canSort: false),

grid.Column("Message", "Message", canSort: false),

grid.Column("EmailId", "Email Id", canSort: false),

grid.Column("CreatedOn", "Created Date", canSort: false),

grid.Column("", "Action",

format:@

Details

)

This Is Details PartialView:-

@model ShopINdeal.Models.ContactU

@Html.DisplayNameFor(model => model.Name)

@Html.DisplayFor(model => model.Name)

@Html.DisplayNameFor(model => model.PhoneNo)

@Html.DisplayFor(model => model.PhoneNo)

@Html.DisplayNameFor(model => model.Message)

@Html.DisplayFor(model => model.Message)

@Html.DisplayNameFor(model => model.Type)

@Html.DisplayFor(model => model.Type)

@Html.DisplayNameFor(model => model.EmailId)

@Html.DisplayFor(model => model.EmailId)

@Html.DisplayNameFor(model => model.OfficeNo)

@Html.DisplayFor(model => model.OfficeNo)

@Html.DisplayNameFor(model => model.Address)

@Html.DisplayFor(model => model.Address)

@Html.DisplayNameFor(model => model.Createdby)

@Html.DisplayFor(model => model.Createdby)

@Html.DisplayNameFor(model => model.CreatedOn)

@Html.DisplayFor(model => model.CreatedOn)

@Html.DisplayNameFor(model => model.UpdatedBy)

@Html.DisplayFor(model => model.UpdatedBy)

@Html.DisplayNameFor(model => model.UpdatedOn)

@Html.DisplayFor(model => model.UpdatedOn)

@Html.DisplayNameFor(model => model.Active)

@Html.DisplayFor(model => model.Active)

@Html.DisplayNameFor(model => model.IsDelete)

@Html.DisplayFor(model => model.IsDelete)

@Html.DisplayNameFor(model => model.IsRejected)

@Html.DisplayFor(model => model.IsRejected)

@Html.DisplayNameFor(model => model.DeletedAt)

@Html.DisplayFor(model => model.DeletedAt)

@Html.DisplayNameFor(model => model.DeleteReason)

@Html.DisplayFor(model => model.DeleteReason)

@section scripts

{

}

3 Replies

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

Dr.Ajay Kashyap9y ago
Ramesh Sir ::-

List Method And Details Method :-

[HttpGet]
public ActionResult ContactUsList()
{
var contactus = db.ContactUs.ToList();
return View(contactus);
}
[HttpGet]
public ActionResult Details(long id)
{
var contactus = db.ContactUs.Find(id);
//return View(contactus);
return PartialView("_Details", contactus);
}

List Page View :-

@model IEnumerable
@{
ViewBag.Title = "ContactUs List";
Layout = "~/Views/Shared/_HomeLayout.cshtml";
var grid = new WebGrid(source: Model, canSort: true, rowsPerPage: 15);
grid.Pager(WebGridPagerModes.All);
int firstRecord = (grid.PageIndex * grid.RowsPerPage) + 1;
int lastRecord = (grid.PageIndex * grid.RowsPerPage) + grid.Rows.Count();
}
ContactUs List

@grid.GetHtml(
tableStyle: "table table-responsive backcolor table-striped table-bordered table-hover",
headerStyle: "wedgrid-header",
footerStyle: "webgrid-footer",
alternatingRowStyle: "webgrid-alternating-row",
rowStyle: "webgrid-row-style",
columns:
grid.Columns
(
grid.Column("ContactUsId", "ContactUs Id", canSort: false),
grid.Column("Name", "Full Name", canSort: false),
grid.Column("PhoneNo", "Phone Number", canSort: false),
grid.Column("Type", "Message Type", canSort: false),
grid.Column("Message", "Message", canSort: false),
grid.Column("EmailId", "Email Id", canSort: false),
grid.Column("CreatedOn", "Created Date", canSort: false),
grid.Column("", "Action",
format:@
Details
)
)
)

This Is Details PartialView:-

@model ShopINdeal.Models.ContactU

FriendsInfo

@Html.DisplayNameFor(model => model.Name)

@Html.DisplayFor(model => model.Name)

@Html.DisplayNameFor(model => model.PhoneNo)

@Html.DisplayFor(model => model.PhoneNo)

@Html.DisplayNameFor(model => model.Message)

@Html.DisplayFor(model => model.Message)

@Html.DisplayNameFor(model => model.Type)

@Html.DisplayFor(model => model.Type)

@Html.DisplayNameFor(model => model.EmailId)

@Html.DisplayFor(model => model.EmailId)

@Html.DisplayNameFor(model => model.OfficeNo)

@Html.DisplayFor(model => model.OfficeNo)

@Html.DisplayNameFor(model => model.Address)

@Html.DisplayFor(model => model.Address)

@Html.DisplayNameFor(model => model.Createdby)

@Html.DisplayFor(model => model.Createdby)

@Html.DisplayNameFor(model => model.CreatedOn)

@Html.DisplayFor(model => model.CreatedOn)

@Html.DisplayNameFor(model => model.UpdatedBy)

@Html.DisplayFor(model => model.UpdatedBy)

@Html.DisplayNameFor(model => model.UpdatedOn)

@Html.DisplayFor(model => model.UpdatedOn)

@Html.DisplayNameFor(model => model.Active)

@Html.DisplayFor(model => model.Active)

@Html.DisplayNameFor(model => model.IsDelete)

@Html.DisplayFor(model => model.IsDelete)

@Html.DisplayNameFor(model => model.IsRejected)

@Html.DisplayFor(model => model.IsRejected)

@Html.DisplayNameFor(model => model.DeletedAt)

@Html.DisplayFor(model => model.DeletedAt)

@Html.DisplayNameFor(model => model.DeleteReason)

@Html.DisplayFor(model => model.DeleteReason)

@section scripts
{

}

0
Dr.Ajay Kashyap9y ago
remesh Sir Plz Tell Me How To fatch and display Details In popup window
0
Ramesh Palanivel9y ago
Hi Ajay,

Yes I have done that.. Use Bootstrap "Modal" pop up window.. It will help you!..
0

How to Display Details in Bootstrap Modal popup in MVC

ContactUs List

FriendsInfo