Develop Reference

How to pass partial view data to the parent view controller

I am new to ASP.NET MVC. I have a parent view and a partial view, both using different models. My concern is when I submit the page, the partial view data also should pass to the parent view HTTP Post method. I had created a property in the parent view model to get the data from the partial view model. But when I submit the page, I am getting null. any help would be appreciated
Parent view caseDetails.cshtml:
#model EMSD.Module.Case.CPN.Model.CPNDetailViewModel
#{
ViewBag.Title = "_CPNCaseDetail";
}
<table class="table table-striped">
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<tr>
<td class="leftheaderform">
#Html.LabelFor(model => model.CPN_CAT)
<span style="color:red">*</span>
</td>
<td class="rightdetailform" colspan="3">
#Html.DropDownListFor(model => model.CPN_CAT, new SelectList(Model.InformedCat, "ID", "Name"), "--Select--", new { #class = "form-control form-control-sm col-3" })
#Html.ValidationMessageFor(model => model.CPN_CAT, "", new { #class = "text-danger" })
</td>
</tr>
<tr>
<td class="leftheaderform">
#Html.LabelFor(model => model.CPN_CAT_RMK)
</td>
<td class="rightdetailform" colspan="3">
#Html.TextAreaFor(model => model.CPN_CAT_RMK, new { htmlAttributes = new { #class = "form-control form-control-sm" }, rows = 2, style = "width: 100%; max-width: 100%;" })
#Html.ValidationMessageFor(model => model.CPN_CAT_RMK, "", new { #class = "text-danger" })
</td>
</tr>
*used HTML.partial for calling partial view*
#Html.Partial("~/Views/Shared/Address.cshtml", Model.Address)
</table>
Parent view model:
public class CPNDetailViewModel
{
[DisplayName("Informed Category")]
public string CPN_CAT { get; set; }
[DisplayName("Remarks ")]
public string CPN_CAT_RMK { get; set; }
// property for getting data from partial view
public UpdateGasSupplierViewModel Address { get; set; }
}
Partial view Address.chtml:
#model EMSD.Module.Misc.Model.UpdateGasSupplierViewModel
<table class="table table-striped">
<tr>
<td><font color="blue">Search Address</font></td>
<td colspan="4"> <input id="FreeEnglishAddressText" class="form-control" /></td>
<td><button type="button" onclick="callAPI()" class="btn btn-outline-primary form-control">Search</button></td>
</tr>
<tr>
<td>
Flat
</td>
<td>
#Html.DropDownListFor(model => model.GSC_ENG_FT, new SelectList(Model.FlatList, "ID", "Name"), "--Select--", new { #class = "form-control" })
</td>
<td>
#Html.EditorFor(model => model.GSC_ENG_FT_2, new { htmlAttributes = new { #class = "form-control" } })
</td>
</tr>
</table>
Partial view model:
namespace EMSD.Module.Misc.Model
{
public class UpdateGasSupplierViewModel
{
public string GSC_ID { get; set; }
public string GSC_COY_ENAME { get; set; }
}
}
Parent controller method:
[HttpPost]
public ActionResult _CPNCaseDetail(CPNDetailViewModel model)
{
string Post = Session["user_post"].ToString();
if (ModelState.IsValid)
{
cPNCaseService.Save(model);
}
return RedirectToAction("Case", "Case", new { Id = model.CASE_ID, Id2 = queueId, Id3 = "", Id4 = "Y" });
}

You need to use Templated helpers
Templated helpers are different than partials in that special contextual information from the parent is passed down to the child as long as we’re using the Html.EditorXyz() HtmlHelper methods.
Check This

Best practice to display values after submitting form in ASP.NET MVC

I am quite new to ASP.NET and MVC and I'm currently trying the following:
Model: Properties of the form
View: Display a form to the user
Controller:
Action: Do something
Go back to initial view and display values to user
With normal html I got this to work. With razor syntax I so far did not manage to re-display the values after the form was submitted.
My model:
namespace MyModels
{
public class SubmitTicketFormModel
{
[DisplayName("First Name")]
public string _firstName { get; set; }
[DisplayName("Last Name")]
public string _lastName { get; set; }
}
}
My View:
#model MyModels.SubmitTicketFormModel
#{
ViewData["Title"] = "SubmitTicketView";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h1>Request</h1>
#using (Html.BeginForm("SubmitTicketAction", "SubmitTicketContoller", FormMethod.Post))
{
<div class="form-group">
#Html.LabelFor(model => model._firstName)
#Html.TextBoxFor(model => model._firstName, new { #class = "form-control" })
#Html.LabelFor(model => model._lastName)
#Html.TextBoxFor(model => model._lastName, new { #class = "form-control" })
</div>
<input type="submit" value="Post comment" />
}
<table class="table table-bordered table-sm">
<thead class="thead-light">
<tr>
<th>col1</th>
<th>col2</th>
</tr>
</thead>
<tbody>
<tr>
<td>
#Model._firstName
</td>
<td>
#Model._lastName
</td>
</tr>
</tbody>
</table>
Controller:
public class SubmitTicketController : Controller
{
public ActionResult SubmitTicketView()
{
var TicketInstance = new SubmitTicketFormModel();
return View(TicketInstance);
}
[HttpPost]
public ActionResult SubmitTicketAction(SubmitTicketFormModel model)
{
var NewTicketInstance = new SubmitTicketFormModel()
{
_firstName = model._firstName,
_lastName = model._lastName
};
return View(NewTicketInstance);
}
}
}
Can you please guide me in the right direction?

If you want the same View to render after the user clicks on submit button, then I guess you don't want that #using (Html.BeginForm("SubmitTicketAction", "SubmitTicketContoller", FormMethod.Post)) in the UI to show up again. Only the values of first name and last name in your view of which you've written your logic down in your view.
In that case, you can just pass a ViewBag in your view from controller which will help your View understand whether it has to show the input form or display user's entered data.
[HttpPost]
public ActionResult SubmitTicketAction(SubmitTicketFormModel model)
{
var NewTicketInstance = new SubmitTicketFormModel()
{
_firstName = model._firstName,
_lastName = model._lastName
};
ViewBag.Check = "true";
return View(ViewName , modelname);
}
And then in your view,
#model MyModels.SubmitTicketFormModel
#{
ViewData["Title"] = "SubmitTicketView";
Layout = "~/Views/Shared/_Layout.cshtml";
}
#if(ViewBag.Check != null)
{
<h1>Request</h1>
#using (Html.BeginForm("SubmitTicketAction", "SubmitTicketContoller", FormMethod.Post))
{
<div class="form-group">
#Html.LabelFor(model => model._firstName)
#Html.TextBoxFor(model => model._firstName, new { #class = "form-control" })
#Html.LabelFor(model => model._lastName)
#Html.TextBoxFor(model => model._lastName, new { #class = "form-control" })
</div>
<input type="submit" value="Post comment" />
}
}
else
{
<table class="table table-bordered table-sm">
<thead class="thead-light">
<tr>
<th>col1</th>
<th>col2</th>
</tr>
</thead>
<tbody>
<tr>
<td>
#Model._firstName
</td>
<td>
#Model._lastName
</td>
</tr>
</tbody>
</table>
}

How can I view both table and form in same view

I have recently learning ASP.NET MVC5.
I am trying to see both the form and a table(return as partialview) in one view but i'm getting this error.
System.NullReferenceException: Object reference does not set to an instance of an object.
Here is my Model:
public class Prescription
{
[Key]
public int PrescriptionID { get; set; }
[ForeignKey("Assessment")]
public int? AssessmentID { get; set; }
public Assessment Assessment { get; set; }
[ForeignKey("Medicine")]
[Display(Name ="Prescription")]
public int? MedcineID { get; set; }
public Medicine Medicine { get; set; }
}
My main view where I want to put my partial view:
#using ClinicManagemet
#model ClinicManagemet.Models.Prescription
#{
ViewBag.Title = "Create";
}
<h2>Create</h2>
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>Prescription</h4>
<hr />
<div class="form-group">
#Html.LabelFor(model => model.MedcineID, "MedcineID", htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.DropDownList("MedcineID", null, htmlAttributes: new { #class = "form-control" })
#Html.ValidationMessageFor(model => model.MedcineID, "", 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>
}
#Html.Action("ViewPrescription","Assessments")
<div>
#Html.ActionLink("Back to Home", "Home")
</div>
My partial view:
#model IEnumerable<ClinicManagemet.Models.Prescription>
<table class="table">
<tr>
<th>
#Html.DisplayNameFor(model => model.Assessment.Complaint)
</th>
<th>
#Html.DisplayNameFor(model => model.Medicine.MedicineName)
</th>
<th></th>
</tr>
#foreach (var item in Model) { //Here is the line where I get the error
<tr>
<td>
#Html.DisplayFor(modelItem => item.Assessment.Complaint)
</td>
<td>
#Html.DisplayFor(modelItem => item.Medicine.MedicineName)
</td>
<td>
#Html.ActionLink("Edit", "Edit", new { id=item.PrescriptionID }) |
#Html.ActionLink("Details", "Details", new { id=item.PrescriptionID }) |
#Html.ActionLink("Delete", "Delete", new { id=item.PrescriptionID })
</td>
</tr>
}
</table>
My partial view's controller:
public ActionResult ViewPrescription()
{
return PartialView();
}
Edit: If I fix this, I'll try to add Ajax so whenever I insert something, it will just refresh the partial view.

Load your partial view like this,
#{
Html.RenderAction("ViewPrescription","YourControllerName")
}
And in your ViewPrescription method, return the data,
{
//Fetch the data here
return PartialView(model);
}
Hope it helps.

You're not passing a model into the partial view when returning the view.
public ActionResult ViewPrescription()
{
ClinicManagemet.Models.Prescription model = _service.GetPerscription();
return PartialView(model);
}

MVC Passing a Complex Object to the controller for saving

I am writing a web page with MVC and Entity Framework.
I have an order with line items attached and want to return a complex object to the controller for processing.
I have now included all the code.
My view:
#model BCMManci.ViewModels.OrderCreateGroup
#{
ViewBag.Title = "Create";
}
<h2>New Order</h2>
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<h4>#Html.DisplayFor(model => model.Order.Customer.FullName)</h4>
<table>
<tr>
<td><b>Order Date:</b> #Html.DisplayFor(model => model.Order.OrderDate)</td>
<td><b>Status:</b> #Html.DisplayFor(model => model.Order.OrderStatus.OrderStatusName)</td>
</tr>
<tr>
<td colspan="2">
<b>Notes</b>
#Html.EditorFor(model => model.Order.Notes, new { htmlAttributes = new { #class = "form-control" } })
</td>
</tr>
</table>
#Html.ValidationMessageFor(model => model.Order.Notes, "", new { #class = "text-danger" })
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<table class="table table-striped table-hover">
<thead>
<tr>
<td>Name</td>
<td>Price</td>
<td>Discount</td>
<td>Total</td>
<td>Quantity</td>
</tr>
</thead>
<tbody>
#foreach (var product in Model.ProductWithPrices)
{
<tr>
<td>
#Html.DisplayFor(modelItem => product.ProductName)
</td>
<td>
#Html.DisplayFor(modelItem => product.SellingPrice)
</td>
<td>
#Html.DisplayFor(modelItem => product.DiscountPrice)
</td>
<td>
#Html.DisplayFor(modelItem => product.TotalPrice)
</td>
<td>
#Html.EditorFor(modelItem => product.Quantity, new { htmlAttributes = new { #class = "form-control" } })
</td>
</tr>
}
</tbody>
</table>
<input type="submit" value="Create" class="btn btn-default" />
}
<div class="btn btn-danger">
#Html.ActionLink("Cancel", "Index")
</div>
#section Scripts {
#Scripts.Render("~/bundles/jqueryval")
}
Controller:
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Create([Bind(Include = "Order,ProductWithPrices,Order.Note,product.Quantity")] OrderCreateGroup order)
{
try
{
if (ModelState.IsValid)
{
db.Orders.Add(order.Order);
foreach (var orderItem in order.ProductWithPrices.Select(item => new OrderItem
{
OrderId = order.Order.OrderId,
ProductId = item.ProductId,
Quantity = item.Quantity,
ItemPrice = item.SellingPrice,
ItemDiscount = item.DiscountPrice,
ItemTotal = item.TotalPrice
}))
{
db.OrderItems.Add(orderItem);
}
db.SaveChanges();
return RedirectToAction("ConfirmOrder", new {id = order.Order.OrderId});
}
}
catch (DataException /* dex */)
{
//TODO: Log the error (uncomment dex variable name and add a line here to write a log.
ModelState.AddModelError("", "Unable to save changes. Try again, and if the problem persists see your system administrator.");
}
ViewBag.Products = db.Products.Where(model => model.IsActive == true);
PopulateDropdownLists();
return View(order);
}
Data Source:
public class OrderCreateGroup
{
public OrderCreateGroup()
{
ProductWithPrices = new List<ProductWithPrice>();
}
public Order Order { get; set; }
public ICollection<ProductWithPrice> ProductWithPrices { get; set; }
}
public class ProductWithPrice : Product
{
public decimal SellingPrice { get; set; }
public decimal DiscountPrice { get; set; }
public int Quantity { get; set; }
public decimal TotalPrice { get; set; }
}
However, the values that are entered on the form are not being passed, through. So I can't access them in the controller. The 'productWithPrices' collection is null although there is Data in it on the web page.
I have tried making it asyc and also tried changing the ActionLink button like below but it didn't get to the controller.
#Html.ActionLink("Create", "Create", "Orders", new { orderCreateGoup = Model }, null)
This is the controller but it now doesn't make sense as the parameter passed in the datasource for the page.
public ActionResult Create(OrderCreateGroup orderCreateGoup)
Please, can you give me direction on the best way of doing this?

In your OrderCreateGroup class initialize the collection to an empty list.
public class OrderCreateGroup
{
public OrderCreateGroup()
{
ProductWithPrices = new List<ProductWithPrice>();
}
public Order Order { get; set; }
public ICollection<ProductWithPrice> ProductWithPrices { get; set; }
}
You'll need to add #Html.HiddenFor(m => m.SellingPrice) and similarly for other bound fields that are using DisplayFor if you want to post them back to the controller.
Note: For your benefit, try to have a look at the generated HTML code when your page is rendered in the browser and see what tags are generated inside the <form> tag with a name attribute.

make sure you bind the appropriate property from the complex object, like the following:
#model BCMManci.ViewModels.OrderCreateGroup
...
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
...
<div class="form-group">
#Html.LabelFor(model => model.LastName, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.OrderCreateGroup.Order.Quantity, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.OrderCreateGroup.Order.Quantity, "", 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>
Note:model.OrderCreateGroup.Order.Quantity would be one the your order's property.
hope this helps.

Generate razor syntax in C# class and send to view

I have a class which is called Ratings and has 5 different ratings (1=poor .. 5 = excellent). I also have a model (Review) which has 10 questions and each uses the ratings class. Now in the View I have a forEach for each of these properties in the Review class so the code is somewhat cut an paste. Rather than duplicating the code and just changing a property on them what I would like to do is create a method in the Ratings class which generates the razor syntax, if this is at all possible.
Sample on how it is now and what I would like to do is below.
Current View (only displaying 2 properties:
<tr>
<td class="control-label col-md-4">
#Html.LabelFor(model => model.ReviewModel.SpeakerReview, htmlAttributes: new { #class = "control-label " })
</td>
#foreach (var rating in ratingModel.RatingList)
{
<td class="col-md-1">
#Html.RadioButtonFor(model => model.ReviewModel.SpeakerReview, rating.RatingId)
</td>
}
</tr>
<tr>
<td class="control-label col-md-4">
#Html.LabelFor(model => model.ReviewModel.AvHandoutsApplicable, htmlAttributes: new { #class = "control-label " })
</td>
#foreach (var rating in ratingModel.RatingList)
{
<td class="col-md-1">
#Html.RadioButtonFor(model => model.ReviewModel.AvHandoutsApplicable, rating.RatingId)
</td>
}
</tr>
How I would like it to look:
View:
<tr>
<td class="control-label col-md-4">
#Html.LabelFor(model => model.ReviewModel.SpeakerReview, htmlAttributes: new { #class = "control-label " })
</td>
#ReviewModel.BuildRatingList(ratingModel, ReviewModel.SpeakerReview);
</tr>
<tr>
<td class="control-label col-md-4">
#Html.LabelFor(model => model.ReviewModel.AvHandoutsApplicable, htmlAttributes: new { #class = "control-label " })
</td>
#ReviewModel.BuildRatingList(ratingModel, ReviewModel.AvHandoutsApplicable);
</tr>
Class:
public static string BuildRatingList(Rating ratingModel, object reviewItem)
{
string RtnVal = "";
foreach (var rating in ratingModel.RatingList)
{
RtnVal = "<td class='col-md-1'>#Html.RadioButtonFor(model => " + reviewItem + ", rating.RatingId)</td>";
}
return RtnVal;
}
Thanks in advance!

While you can do almost exactly what you are asking by plugging in extra RazorEngine module from NUGET, I think you are better off using plain partial views or View Components, e.g. component:
namespace ViewComponentSample.ViewComponents
{
public class PriorityList : ViewComponent
{
private readonly ToDoContext db;
public PriorityList(ToDoContext context)
{
db = context;
}
public async Task<IViewComponentResult> InvokeAsync(
int maxPriority, bool isDone)
{
var items = await GetItemsAsync(maxPriority, isDone);
return View(items);
}
private Task<List<TodoItem>> GetItemsAsync(int maxPriority, bool isDone)
{
return db.ToDo
.Where(x => x.IsDone == isDone && x.Priority <= maxPriority)
.ToListAsync();
}
}
}
and view:
#using ViewComponentSample.Models
#using ViewComponentSample.ViewComponents
#model IEnumerable<TodoItem>
<h2>ToDo nameof</h2>
<div>
#await Component.InvokeAsync(nameof(PriorityList),
new { maxPriority = 4, isDone = true })
</div>