Z 10 ) PARTIAL VIEWS IN ASP.NET MVC
PARTIAL VIEWS IN ASP.NET MVC
· Partial view represents a sub-view of a main view.
· Partial view allows you to reuse common markups across the different views of the application.
· We can use partial views in different views.
· Partial views cannot be used separately, we have to attach partial in some other view.
· Partial view extension is .cshtml like a view.
· When we have to use some html markup on some pages not all pages then we can use partial view.
To create a partial view in Visual Studio .NET, you need to perform the following steps:
1. Right-click the Views/Shared folder in the Solution Explorer window and select Add View. The AddView dialog box is displayed.
2. In the AddView dialog box, specify a name for the partial view in the View Name text field.
3. Select the Create as a partial view check box.
There are 2 types of partial views.
1. Static
a. Views whose layout not changed i.e header, footer, navigation bar etc.
2. Dynamic
a. Views whose contents can change accordingly, just like shopping cart where number of product can be changed.
For static partial views we use two methods of html helper class.
1. Html.Partial
2. Html.RenderPartial
For dynamic partial views we use two methods of html helper class.
3. Html.Action
4. Html.RenderAction
SIMILARITIES AND DIFFERENCE BETWEEN HTML.PARTIAL AND HTML.RENDERPARTIAL
· Both Html.Partial and Html.RenderPartial can be used to access or display a partial view in a view
Html.Partial | Html.RenderPartial |
Method that returns MVCHtmlString | Method without any return value, it means it returns void. |
Rendered Partial view result can be stored in string variable. | Rendered Partial view result cannot be stored in string variable. |
Slow in access | Fast in access |
Q ) How to Create Partial View ?
Point :- When create the partial view then use the ( Underscore symbol ( _ ) [ _partialViewname ] )
Step :- goto the solution explorer -- click on the shared folder -- Partialview name( _EmpplyoeeList ) -- tick on the create partial view -- add
Q ) How to Access Partial View in Main View ?
:- There are two types access partial view in main view using
1 ) Syntax :- @Html.Partial("_PartialViewName")
Ex :- @Html.Partial("_EmpplyoeeList")
2 ) Syntax:-
@{
Code :-
Controller :- HomeController
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace PartialView_PartialView.Controllers
{
public class HomeController : Controller
{
// GET: Home
public ActionResult Index()
{
return View();
}
public ActionResult Contact()
{
return View();
}
public ActionResult About()
{
return View();
}
}
}
Partial View 1 :- _EmpplyoeeList.cshtml
<ul>
<li>Aman</li>
<li>Roman</li>
<li>Salman</li>
<li>Arbaj</li>
</ul>
Partial View 2 :- _LoginForm.cshtml
<form style="border:5px black ridge; width:300px; height:260px">
<h3 class="text-center">Login Form</h3>
<label>User Name</label>
<input class="form-control" type="text" name="user" />
<br />
<label>Password</label>
<input class="form-control" type="password" name="pass" />
<br />
<input class="form-control" type="submit" value="Submit" />
</form>
Contact.cshtml :-
@{
ViewBag.Title = "Contact";
}
<h2>Contact</h2>
<h3>
@Html.Partial("_EmpplyoeeList")
<br />
<br />
@{
Html.RenderPartial("_EmpplyoeeList");
}
</h3>
@Html.Partial("_LoginForm")
<br />
<br />
@{
Html.RenderPartial("_LoginForm");
}
OutPut :-
 |
| Index.cshtml |
 |
| About.cshtml |
 |
| Contact.cshtml |
Comments
Post a Comment