When I tried to load my partial view inside the modal. it loads with layout page also. But I didn't put my layout page to my partial view. Why layout page called automatically to my partial view I cannot find the layout page called in in partial view.
This is my partial view code
#model Mvc.Models.Company
#Scripts.Render("~/bundles/jquery")
#Scripts.Render("~/bundles/jqueryval")
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>Company</h4>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
#Html.LabelFor(model => model.Name, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Name, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Name, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Address, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Address, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Address, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.PhoneNumber, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.PhoneNumber, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.PhoneNumber, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.URL, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.URL, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.URL, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Email, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Email, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Email, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Active, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
<div class="checkbox">
#Html.EditorFor(model => model.Active)
#Html.ValidationMessageFor(model => model.Active, "", new { #class = "text-danger" })
</div>
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Tstamp, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Tstamp, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Tstamp, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.IsDeleted, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
<div class="checkbox">
#Html.EditorFor(model => model.IsDeleted)
#Html.ValidationMessageFor(model => model.IsDeleted, "", new { #class = "text-danger" })
</div>
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Create" class="btn btn-default" />
</div>
</div>
</div>
}
<div>
#Html.ActionLink("Back to List", "Index")
</div>
This is my Controller code
public ActionResult _Create()
{
return View();
}
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult _Create([Bind(Include = "CompanyID,Name,Address,PhoneNumber,URL,Email,Active")] Company company)
{
if (ModelState.IsValid)
{
db.Companies.Add(company);
db.SaveChanges();
return RedirectToAction("Index");
}
return View(company);
}
Calling Create page from the Index page
<button id="createCompanyButton" type="button" class="btn btn-info">Create Company</button>
<div class="modal fade" role="dialog" id="createCompanyFormModal" data-backdrop="static" data-keyboard="false">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
<h4 class="modal-title">Default Modal</h4>
</div>
<div id="createCompanyFormModalbody" class="modal-body">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default pull-left" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
<!-- /.modal-content -->
</div>
</div>
<script>
$(document).ready(function() {
$(document).on('click','#createCompanyButton', function(event) {
event.preventDefault();
event.stopImmediatePropagation();
$.ajax({
url: '/Companies/_Create',
type: 'GET',
success: function(data) {
$('#createCompanyFormModalbody').html(data);
$('#createCompanyFormModal').modal('show');
},
error: function() {
alert("There is some problem in the service!");
}
});
});
});
</script>
Try returning PartialView() instead of View()
I think your problem lies in your action, you are returning partial view result.
try this, I hope this will work for you!
public ActionResult _Create()
{
return PartialView("_nameOfPartial");
}
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult _Create([Bind(Include = "CompanyID,Name,Address,PhoneNumber,URL,Email,Active")] Company company)
{
if (ModelState.IsValid)
{
db.Companies.Add(company);
db.SaveChanges();
return RedirectToAction("Index");
}
return PartialView("_NameOfPatial", company);
}
if you are showing partial list on your index then you should return like this
public ActionResult Index(PrintingListSearchFilter filter)
{
//your model logic
return Request.IsAjaxRequest() ? PartialView("_yourListPartialView", model) :
View("Index", model) as ActionResult;
}
Related
I have created a view of creating template like this way-
https://i.stack.imgur.com/sMnjC.png
And it auto-generated a page like this-
https://i.stack.imgur.com/lGeeZ.png
How to increase the width of the input-text and form?
My generated register.cshtml is given below-
#model LoginPart.Models.Person
#{
ViewBag.Title = "Register";
}
<h2>Register</h2>
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>User1</h4>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
#Html.LabelFor(model => model.userName, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.userName, new { htmlAttributes = new { #class = "form-control col-md-10" } })
#Html.ValidationMessageFor(model => model.userName, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.userEmail, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.userEmail, new { htmlAttributes = new { #class = "form-control col-md-10" } })
#Html.ValidationMessageFor(model => model.userEmail, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.userPass, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.userPass, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.userPass, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.userPhone, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.userPhone, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.userPhone, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Create" class="btn btn-default" />
</div>
</div>
</div>
}
<div>
#Html.ActionLink("Back to List", "Index")
</div>
#section Scripts {
#Scripts.Render("~/bundles/jqueryval")
You can add custom css file for your page.
In layout cshtml
<head>
#RenderSection("customcss", required: false)
</head>
In your cshtml for page
#{
Layout = "~/Views/Shared/_Layout.cshtml";
}
#section customcss
{
<link href="~/Content/YourPage.css" rel="stylesheet" type="text/css" />
}
In YourPage.css (my example)
input{ width: 300px;}
form{ width: 80%; }
Comment out set max-width in site.css
/input,
select,
textarea {
max-width: 280px;
}/
I've tried so many ways to load the 'edit' partial view inside my modal but still no luck for it. I'm new to MVC, I've tried to do CRUD operation inside the modal window. Without modal i can perform CRUD operation. Now i want to do CRUD operation inside the modal window.
This my Script section
<script>
$(document).ready(function () {
$(document).on('click', '#edit', function (event) {
event.preventDefault();
event.stopImmediatePropagation();
$.ajax({
url: '/Companies/_Edit',
type: 'GET',
success: function (data) {
$('#createCompanyFormModalbody').html(data);
$('#createCompanyFormModal').modal('show');
},
error: function () {
alert("There is some problem in the service!");
}
});
});
});
</script>
This is my Edit Partial view
#model Mvc.Models.Company
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>Company</h4>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
#Html.HiddenFor(model => model.CompanyID)
<div class="form-group">
#Html.LabelFor(model => model.Name, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Name, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Name, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Address, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Address, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Address, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.PhoneNumber, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.PhoneNumber, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.PhoneNumber, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.URL, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.URL, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.URL, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Email, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Email, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Email, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Active, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
<div class="checkbox">
#Html.EditorFor(model => model.Active)
#Html.ValidationMessageFor(model => model.Active, "", new { #class = "text-danger" })
</div>
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Tstamp, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Tstamp, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Tstamp, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.IsDeleted, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
<div class="checkbox">
#Html.EditorFor(model => model.IsDeleted)
#Html.ValidationMessageFor(model => model.IsDeleted, "", new { #class = "text-danger" })
</div>
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Save" class="btn btn-default" />
</div>
</div>
</div>
}
<div>
#Html.ActionLink("Back to List", "Index")
</div>
This is my Controller class
public ActionResult _Edit(int? id)
{
if (id == null)
{
return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
}
Company company = db.Companies.Find(id);
if (company == null)
{
return HttpNotFound();
}
// return View(company);
return PartialView(company);
}
// POST: Companies/Edit/5
// To protect from overposting attacks, please enable the specific properties you want to bind to, for
// more details see https://go.microsoft.com/fwlink/?LinkId=317598.
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult _Edit([Bind(Include = "CompanyID,Name,Address,PhoneNumber,URL,Email,Active,Tstamp,IsDeleted")] Company company)
{
if (ModelState.IsValid)
{
db.Entry(company).State = EntityState.Modified;
db.SaveChanges();
return RedirectToAction("Index");
}
return View(company);
}
create partial view but it's not loaded inside the modal. I tried so many ways but still no luck to load partial view inside the modal. what I tried it is in down. I want to load another action method such as create method inside the modal window.
https://www.youtube.com/watch?v=3he9CLXmASo
Above link is example i want to do like this.
This is my modal code
<script>
$(document).ready(function() {
$("#showGame").click(function() {
var url = $("#gameModal").data("url");
$.get(url, function(data) {
$("#gameContainer").html(data);
$("#gameModal").modal("show");
});
});
});
<div class="modal fade" id="gameModal" data-url="#Url.Action("Create")">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
<h4 class="modal-title">Default Modal</h4>
</div>
<div class="modal-body">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default pull-left" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
This is my Partial view code
#model Mvc.Models.Company
#using (Html.BeginForm()) {
#Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>Company</h4>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
#Html.LabelFor(model => model.Name, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Name, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Name, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Address, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Address, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Address, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.PhoneNumber, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.PhoneNumber, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.PhoneNumber, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.URL, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.URL, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.URL, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Email, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Email, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Email, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Active, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
<div class="checkbox">
#Html.EditorFor(model => model.Active)
#Html.ValidationMessageFor(model => model.Active, "", new { #class = "text-danger" })
</div>
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Tstamp, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Tstamp, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Tstamp, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.IsDeleted, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
<div class="checkbox">
#Html.EditorFor(model => model.IsDeleted)
#Html.ValidationMessageFor(model => model.IsDeleted, "", new { #class = "text-danger" })
</div>
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Create" class="btn btn-default" />
</div>
</div>
</div>}
<div>
#Html.ActionLink("Back to List", "Index")
</div>
#section Scripts {
#Scripts.Render("~/bundles/jqueryval")
}
This is my Controller Code
public ActionResult Create()
{
return View();
}
// POST: Companies/Create
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Create([Bind(Include = "CompanyID,Name,Address,PhoneNumber,URL,Email,Active,Tstamp,IsDeleted")] Company company)
{
if (ModelState.IsValid)
{
db.Companies.Add(company);
db.SaveChanges();
return RedirectToAction("Index");
}
return View(company);
}
First write your modal related html code as follows:
// Button that will trigger the modal
<button id="createCompanyButton" type="button" class="btn btn-info">Create Company</button>
// Your modal code
<div class="modal fade" role="dialog" id="createCompanyFormModal" data-backdrop="static" data-keyboard="false">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
<h4 class="modal-title">Default Modal</h4>
</div>
<div id="createCompanyFormModalbody" class="modal-body">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default pull-left" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
<!-- /.modal-content -->
</div>
</div>
Then in the JavaScript:
$(document).ready(function() {
$(document).on('click','#createCompanyButton', function(event) {
event.preventDefault();
event.stopImmediatePropagation();
$.ajax({
url: '/Companies/Create',
type: 'GET',
success: function(data) {
$('#createCompanyFormModalbody').html(data);
$('#createCompanyFormModal').modal('show');
},
error: function() {
alert("There is some problem in the service!")
}
});
});
});
Now it should show the form into modal when click the createCompanyButton button.
I want pass some Id's values from my Edit form.
Let say I want pass value of ProductId, CountryId and ModelId and I tried like this:
<input type="submit" value="Save" class="btn btn-default" onclick="return Update(#(model.ProductId),#(model.CountryId),#(model.ModelId) )/>
But not working.
I'am in my Edit form and this is my form.
#model Products.Models.Product
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>Product</h4>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
#Html.HiddenFor(model => model.ProductId)
#Html.HiddenFor(model => model.CountryId)
#Html.HiddenFor(model => model.ModelId)
<div class="form-group">
#Html.LabelFor(model => model.ProductName, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.ProductName, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Model, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Model, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Model, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Model, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Status, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Status, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Status, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Save" class="btn btn-default" onclick="return Update(#(model.ProductId),#(model.CountryId),#(model.ModelId) )/>
</div>
</div>
</div>
}
<div>
#Html.ActionLink("Back to List", "Index")
</div>
Thank you!
<input type="submit" value="Save" class="btn btn-default" onclick="return Update(#Model.ProductId,#Model.CountryId,#Model.ModelId)/> And you will get all three Values. Happy coding!
I have a panel like below:
and the view code is:
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingFour">
<h4 class="panel-title">
<a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
Product Details
</a>
</h4>
</div>
<div id="collapseFour" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingFour">
<div class="panel-body">
<a class="btn btn-lg btn-primary btn-add-panel" > <i class="glyphicon glyphicon-plus"></i> Add new Product</a>
<div id="propanel"></div>
<br />
<div class="panel panel-default template" >
<div class="panel-heading">
<span class="glyphicon glyphicon-remove-circle pull-right "></span>
<h4 class="panel-title">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapse5">
New Product
</a>
</h4>
</div>
<div id="collapse5" class="panel-collapse collapse">
<div class="panel-body">
<div class="form-group">
#Html.LabelFor(model => model.JobProduct.Detail, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.JobProduct.Detail, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.JobProduct.Detail, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.JobProduct.UnitPrice, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.JobProduct.UnitPrice, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.JobProduct.UnitPrice, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.JobProduct.Count, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.JobProduct.Count, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.JobProduct.Count, "", new { #class = "text-danger" })
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
this panel maybe has one product or more.in viewmodel i get an object of product type.i want to create list in view of product inserted and pass that to controller as a list.actually i want to create list in view and add object in in it.
how can i get product inserted and send as a list to controller?
Your base class:
public class JobProduct
{
public string Detail{get;set;}
public decimal UnitPrice{get;set;}
public int Count{get;set;}
}
Model class:
public class JobList
{
public IEnumerable<JobProduct> JobProductList { get; set; }
}
Pass the JobProductList from get method to view:
#for (int i = 0; i < Model.JobProductList.length; i++)
{
<div id="collapse#(i+1)" class="panel-collapse collapse">
<div class="panel-body">
<div class="form-group">
#Html.LabelFor(model => model.JobProductList[i].Detail, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.JobProductList[i].Detail, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.JobProductList.Detail, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.JobProductList[i].UnitPrice, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.JobProductList[i].UnitPrice, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.JobProductList[i].UnitPrice, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.JobProductList[i].Count, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.JobProductList[i].Count, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.JobProductList[i].Count, "", new { #class = "text-danger" })
</div>
</div>
</div>
</div>
}
Your final Create post method should accept the enumarable list:
[HttpPost]
public ActionResult Create(IEnumerable<JobProductlist> job)
{
return View(job);
}