If you want to reuse a view in your web application, you can go for partial view concept. Partial view is like regular view with file extension .cshtml.We can use partial view when the situation like we need a header, footer reuse for the mvc web application. We can say that it’s like a user control concept in asp.net.
Here i am going to explain how to create a partial view in mvc 4 asp.net application.
First add a view to shared folder with view name _Product .the best way to create partial view with name preceded by '_', because the name specifying that it is reusable.
Here in this example, I am using the partial view to display the item selected in the webgrid.
Creating webgrid example is in below link:
http://articlesforprogramming.blogspot.in/2013/07/webgrid-in-aspnet-mvc.html
Add html controls in partial view fir display the selected item.
| <body> <div> <label>Id:</label> @Html.TextBox("Id", Model.Id) <label>Name:</label> @Html.TextBox("Name", Model.Id) <label>Description:</label> @Html.TextBox("Description", Model.Description) <label>Quantity:</label> @Html.TextBox("Quantity", Model.Quantity) </div> </body> |
We can call the partial view in a normal view like:
| Html.RenderPartial("~/Views/Shared/_Product.cshtml",
product); OR @Html.Partial("~/Views/Shared/_Product.cshtml", product); |
Html.Partial
returns a string, Html.RenderPartial calls Write internally, and returns void.
You can store the output of Html.Partial in a variable, or return it from a
function. You cannot do this with Html.RenderPartial.Because the result will be
written to the Response stream during the execution. So @html.RenderPartial()
has fast execution than @html.Partial() due to RenderPartial give quick
response to Output.
We can call the partial view if grid have any
selected item. The code block is here:| @if (grid.HasSelection) { product =(PartialViewSample.Models.Product)grid.Rows[grid.SelectedIndex].Value; Html.RenderPartial("~/Views/Shared/_Product.cshtml", product); } |
| grid.Column("Detail", format: @<text>@Html.ActionLink("Select", "Submit", new { QtId = item.QtId }) </text>) |
And in the action get the selected item and pass as parameter to display view.
| public ActionResult Submit(Product
product) { return View(product); } |
This comment has been removed by a blog administrator.
ReplyDeleteIt is very Excellent sample, minor bug:
ReplyDeletegrid.Column("Detail", format: @@Html.ActionLink("Select", "Submit", new { QtId = item.QtId }) )
Should like this:
item.QtId --- > item.Id
How to create SubmitView page? I can't get data for product in control file, it is NULL in submit(Product product)
ReplyDeletePartial Views :
ReplyDeleteA partial view is a view that is rendered inside a parent view .
It is similar to an user control(.ascx) of a typical asp.net web form application.
It is a reusable view that can be used across multiple views in a mvc site.
Using Partial View :
As like creating a view, we can also create a partial view, provided in the “Add View” dialog box, check the option “Create as a partial view”.
For rendering the partial view
Use the Partial or RenderPartial method of Html helper to render partial view.
Public ActionResult Index()
{
return PartialView();
}
The Partial method returns a string.
@Html.Partial("viewname");
The RenderPartial method is also similar to Partial method but it renders the output to a response stream
@{ Html.RenderPartial(“Details”); }
Reply
ReplyDeleteThis blog gives very important info about .Net
ReplyDeleteVery nice Thanks for sharing .Net Online Course Hyderabad
ok
ReplyDeleteNice! you are sharing such helpful and easy to understandable blog. i have no words for say i just say thanks because it is helpful for me.
ReplyDeleteDot Net Training in Chennai | Dot Net Training in anna nagar | Dot Net Training in omr | Dot Net Training in porur | Dot Net Training in tambaram | Dot Net Training in velachery