| by Achyut Kendre | 1 comment

What is Child Action Calls? How to in ASP.NET MVC 5?

ASP NET MVC 5

Example Source Code: https://drive.google.com/file/d/1dkgkEq9WR1b1hlDks-pEy8Fx6YBdEEgX/view?usp=sharing

What is Child Action Call?

When we call any action and that action returns view so that action execution will be completed when a view is returned but before completion of view processing if we call any action in between from the view that is called child action call whoes result can be loaded in a view before rendering the original view.

To make the child action call in ASP.NET MVC we have a helper called – 

@Html.Action("ActionName",["ControllerName"],[RouteValue Parameters])

Let us understand it step by step how to create it –

Step 1: Create ASP.NET MVC web application as previously created.

Step 2 : Create a action with a name contact which returns a view as follows. 

public class TestController : Controller
{
  public ActionResult Contact()
   {
      return View();
   }
}

Step 3: Also create two actions called SayHello() and SayBye() which returns string as follows –

public string SayHello()
{
 return "Say Hello method Called!";
}

public string SayBye()
{
  return "This is Say Bye Action Called!";
}

Step 4: Now call the SayHello and SayBye action using child action call from contact.cshtml view as follows –

@{
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Contact</title>
</head>
<body>
    <div>  
        <h2> Contact view used to demo </h2>
        <p> this is contact view used to demo </p>

        <h2> Call Say Hello </h2>
        @Html.Action("SayHello")
        <h2>Call Say Bye </h2>
        @Html.Action("SayBye")
    </div>
</body>
</html>

You can also return a partial view from action using a method PartialView.

PartialView() : – returns partial view having name exactly similar to action name.
Partialview(model) :- returns a strongly typed partial view having same name as that of action name.
PartialView(“viewname”) : – returns a partial view having a name passed as parameter.
PartialView(“viename”,Model):- returns a strongly typed partial view having a name passed as parameter.

Now create three models to create three strongly typed partial view to be returned from three child action calls as follows –

public class Customer
    {
        public Int64 CustomerID { get; set; }
        public string CustomerName { get; set; }
        public string Address { get; set; }
        public string EmailID { get; set; }
        public decimal CreditLimit { get; set; }
    }
public class Emp
    {
        public Int64 EmpID { get; set; }
        public string EmpName { get; set; }
        public string DeptName { get; set; }
        public decimal Salary { get; set; }
    }
public class Product
    {
        public Int64 ProductID { get; set; }
        public string ProductName { get; set; }
        public string MfgName { get; set; }
        public decimal Price { get; set; }
    }

Now create three strongly typed partial view for every model as follows –

_Customre.cshtml

@model PartialViewExampleChildActionCalls.Models.Customer

<table border="1">
    <tr>
        <td>@Html.LabelFor(p=>p.CustomerID)</td>
        <td>@Html.DisplayFor(p=>p.CustomerID)</td>
    </tr>
    <tr>
        <td>@Html.LabelFor(p=>p.CustomerName)</td>
        <td>@Html.DisplayFor(p=>p.CustomerName)</td>
    </tr>
    <tr>
        <td>@Html.LabelFor(p=>p.Address)</td>
        <td>@Html.DisplayFor(p => p.Address)</td>
    </tr>
    <tr>
        <td>@Html.LabelFor(p=>p.EmailID)</td>
        <td>@Html.DisplayFor(p=>p.EmailID)</td>
    </tr>
    <tr>
        <td>@Html.LabelFor(p=>p.CreditLimit)</td>
        <td>@Html.DisplayFor(p=>p.CreditLimit)</td>
    </tr>
</table>

_Emp.cshtml

@model PartialViewExampleChildActionCalls.Models.Emp
<ol>
    <li>Emp ID:@Html.DisplayFor(p => p.EmpID)</li>
    <li>Emp ID:@Html.DisplayFor(p => p.EmpName)</li>
    <li>Emp ID:@Html.DisplayFor(p => p.DeptName)</li>
    <li>Emp ID:@Html.DisplayFor(p => p.Salary)</li>
</ol>

_Product.cshtml

@model PartialViewExampleChildActionCalls.Models.Product

<div style="width:400px;background-color:orange">
   Product ID: @Model.ProductID <br />
  Product Name: @Model.ProductName <br />
   Mfg Name:@Model.MfgName <br />
    Price :@Model.Price <br />
</div>

Create three child action actions those returns those partial views from child actions –

public ActionResult GetCust()
{
 Customer c = new Customer() {CustomerID=123,CustomerName="Akash",Address="Nigdi",CreditLimit=56000,EmailID="Akash@hotmail.com"};
            return PartialView("_Customer",c);
}
public ActionResult GetEmp()
{
  Emp e = new Emp() { EmpID = 1, EmpName = "Suresh", DeptName = "Computer", Salary = 56000 };
          return PartialView("_Emp", e);
}
public ActionResult GetProduct()
{
        Product p = new Product() {ProductID=121,ProductName="Mouse",Price=56000,MfgName="Intex"};
            return PartialView("_Product", p);
 }

No create the action to get main view where from we can make the child action calls to render these partial views as follows –

public ActionResult CombineData()
{
 return View();
}

Now create the CombineData View as follows –


@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>CombineData</title>
</head>
<body>
    <div> 
         <h2> Emp information </h2>
          @Html.Action("GetEmp")

        <hr />
        <h2> Customer Information </h2>
         @Html.Action("GetCust")
        <hr />
        <h2> Product information</h2>
        @Html.Action("GetProduct")

    </div>
</body>

</html>

« Prev

1 Comment

web site

July 7, 2024 at 5:47 am Reply

My spouse and I absolutely love your blog and find many
of your post’s to be exactly what I’m looking for. can you offer guest writers to
write content in your case? I wouldn’t mind producing a post or elaborating on some of the subjects you write about here.
Again, awesome website!

Leave a Reply