How To Embed The Controller Action View On The Page Like Partial Asp.net Core

I was working in a project, during working I personally feel that sometimes most of the developers confuse nearly how to use partial views and partial actions to render the dynamic data. So I just complete my task and write the article to help others. As we already know, Partial Views are the pocket-sized Views that we tin render in different Views. We use partial Views to intermission downwards the large Views. We likewise use fractional Views for reusability purposes. Let's wait at an example of Fractional Views.

Most of the time developers just desire to utilize Partial Views in 2 scenarios.

For Static Purposes
Where they simply want to prove some content in the view which is not dynamic at all.

For Dynamic Purpose
Where he wants to populate the information from the model and pass it into the Partial View through a controller action.

Allow's discuss both of these scenarios and how we can use the Partial Views and Partial Deportment.

Create a sample Empty MVC Application.

Static Scenario

@Html.Partial

Open up the _layout.cshtml page, here we've complete theme HTML folio including navbar code as well. Permit's interruption down the code by making sub views (fractional page), So

Add '_Navbar.cshtml' a partial folio into Shared View.

It is the convention that we make the partial page names starting with an underscore like we practice here.

At present, cut and paste the navbar div from '_layout.cshtml' to '_Navbar.cshtml'.
1. <div grade = "navbar navbar-inverse navbar-fixed-top" >
2. <divgrade = "container" >
3. <divclass = "navbar-header" >
4. <button blazon="push" grade = "navbar-toggle" data-toggle= "plummet" data-target= ".navbar-collapse" >
5. <spanclass = "icon-bar" ></span>
6. <spanclass = "icon-bar" ></span>
7. <spanclass = "icon-bar" ></span>
8. </button>
9. @Html.ActionLink("Application name" , "Index" , "Home" , new { area = "" }, new { @ form = "navbar-brand" })
10. </div>
11. <divclass = "navbar-collapse collapse" >
12. <ulcourse = "nav navbar-nav" >
13. <li>@Html.ActionLink("Abode" , "Index" , "Home" )</li>
14. <li>@Html.ActionLink("About" , "About" , "Home" )</li>
15. <li>@Html.ActionLink("Contact" , "Contact" , "Abode" )</li>
16. </ul>
17. @Html.Fractional("_LoginPartial" )
18. </div>
19. </div>
20. </div>

Now, we explicitly demand to render the fractional folio in the primary (_layout.cshtml) page.
1. <body>
2. @Html.RenderPartial("_Navbar" )
3. <divclass = "container body-content" >
4. @RenderBody()
5. <hr />
6. <footer>
7. <p>© @DateTime.Now.Year - My ASP.NET Awarding</p>
8. </footer>
9. </div>
11. @Scripts.Render("~/bundles/jquery" )
12. @Scripts.Render("~/bundles/bootstrap" )
13. @RenderSection("scripts" , required: false )
14. </body>

Nosotros can as well pass the model to the partial folio as well but it is optional, as we're splitting the layout page and make another fractional page from the layout page. So we don't have whatsoever demand to pass the object to this ('_Navbar.cshtml').

Navbar is all about to prove the navbar on the primary home folio.

@Html.RenderPartial

And if we want to use Html.RenderPartial HTML helper in the same scenario, then nosotros demand to enclose the HTML helper in Razor block of code. Similar nosotros do here,

@{
Html.RenderPartial("_Navbar" );
}

It works the aforementioned. The difference is @Html.Fractional renders the partial view in a string whereas @Html.RenderPartial directly writes in the response stream of the view instead of returning the string. And obviously, @Html.RenderPartial is more efficient than a previous one. Only most of the time developer only know nearly the keyword partial, and so instead of knowing about RenderPartial HTML helper he merely go ahead with Fractional() helper.

Dynamic Scenario

Now, let's suppose you desire to prove the data on the master page or _Layout page. And you want to show the data from the database, then how volition yous do information technology? Well-nigh of the time developers face this situation.

Let me share the solution with y'all.

So hither, we use these Html Helpers

Html.Activity()
Html.RenderAction()

@Html.Action

Here, we only need to telephone call the action with its action name in the view. Like I've done it here.

ASP.NET

Every bit you can run into I'm calling 2 actions (Message and ContactFooter) in my _Layout.cshtml folio.

And now come up back to the actions which nosotros're calling here. Here I've written the logic of these actions.

[ChildActionOnly]
public ActionResult Message()
{
IEnumerable<News> news;
using (ApplicationDbContext context =new ApplicationDbContext())
{
news = context.News.Where(ten => 10.State).ToList();
}
return PartialView( "_News" , news);
}
[ChildActionOnly]
public ActionResult ContactFooter()
{
Contact contact;
using (ApplicationDbContext context =new ApplicationDbContext())
{
contact = context.Contacts.SingleOrDefault();
}
return PartialView( "_Contact" , contact);
}

This is how we write the fractional actions. It is necessary to attribute these actions with [ChildActionOnly] attribute. Don't make async calls to Db in fractional deportment, information technology causes the errors. Yous can see how to call the Fractional views and pass the model to the views.

And more for demo purposes here is the fractional view. Because most of the time, People likewise misfile on how to code for fractional Views, information technology is really exactly the same as normal Views.

@model IEnumerable<TBRD.Models.News>
<ulclass = "marquee" >
@foreach (var message in Model)
{
<li>
<iclass = "fa fa-angle-double-left" ></i>
<a href="@message.Link" target= "_blank" >
@bulletin.Text
</a>
</li>
}
</ul>

Merely this is the code of Partial View (_News.cshtml) in my case.

@Html.RenderAction

And if you want to go with this action then you just need to use the Html helper in razor cake like nosotros do above with Html.PartialView()

@{
Html.Action("ContactFooter" , "Dwelling house" );
}

Determination

Today, we've seen how we can utilise dissimilar kinds of Partial Views, how they work with each other, how nosotros tin show the dynamic data on the master page or _layout page with the assist of partial actions. Don't use the asynchronous calls to the DB in partial activeness, otherwise, you'll carp a lot near the wrong things. You tin can simply retrieve only 2 HTML helpers for your ease: @Html.Activeness to call the partial action and @Html.Partial to render the partial View. It will make your life easier.