MVC 4 load partial view dynamically on single page

Question

I have a MVC 4 application which has a single home view. I have three link buttons and want to load three different forms dynamically based on the button click. I am using mvc partial views. So, if I click on button-1 it should load partialView-1 and should also send value-1 from the corresponding text box to partialView-1.

I am looking for mvc inbuilt approach rather than doing heavy javascript work.

Answer 1

You can do this like this.

A. Have different methods inside your controller returning PartialViewResult

[HttpGet]
    public PartialViewResult GetPartialView1(int value)
    {    
        return PartialView("_PartialView1"); //This view should exist in appropriate views folder.
    }

B. Your buttons on the left handside should be @Ajax.ActionLink

@Ajax.ActionLink(
    "Button1",
    "GetPartialView1",
    new { 
        value1 = 1},
    new AjaxOptions
    {
        HttpMethod = "GET",
        InsertionMode = InsertionMode.Replace,
        UpdateTargetId = "righthandsidebox"
    }
    )

C. The UpdateTargetId = "righthandsidebox" that should be the id of the div on the right hand side. Contents of righthandsidebox will be replace by the PartialView