How to update partial view from another partial view via action results

Question

I have three partial views on main view

on the first partial view I have search functionality and when user clicks on search I want to refresh results into 3rd partial view.

Controller:

public ActionResult Search()
{  
         virtualmodel vm = new virtualmodel(); 
      return PartialView(svm);

} 

[HttpPost]
public ActionResult Search(ViewModel svm)
{  
         // Query to retrive the result 
      // I am not sure what to return from here. Link to another action    or just return back to same same partial 

} 

public ActionResult AnotherPartialPartial()
{
}

In main view

 @{Html.RenderAction("Search", "Searchc");
  }

How to do it? Do I need ajax?

Answer 1

Using ajax you can call a controller action and return it's response to a particular div.

Empty div:

<div class="row" id="div3">

</div>

Ajax to display html in empty div:

function performSearch(searchCriteria) {
   //get information to pass to controller
   var searchInformation = JSON.stringify(**your search information**);

            $.ajax({
                url: '@Url.Action("Search", "ControllerName")',//controller name and action 
                type: 'POST',
                data: { 'svm': searchInformation } //information for search
            })
            .success(function (result) {
                $('#div3').html(result); //write returned partial view to empty div
            })
            .error(function (xhr, status) {
                alert(status);
            })
        }