Question

I have a view in which there is a list.Every record in the list have some child records . When I click on the details link ,I want the records to be displayed in the table below.
What mechanism should I follow to do this ?
I want some way to display the values in table below.

Answer 1

The easiest way to do it would be to call an action that returns a partial view with the record.

If you are using jQuery, the code would be like this:

 <!-- Code for each link, obviously, 1 would be the ID of each record -->
 <a href="/Records/Detail/1" class="details">View details</a>

Wherever you want to show the details, add an empty div:

 <div id="viewDetails"></div>

jQuery code, to include in the head of the document:

 $(document).ready( function() {
       $('.details').live('click', function() {
            var link = $(this);
            $('#viewDetails').load(link.attr('href'));
            return false;
       });
 });

Code for the action:

 public ActionResult Details(int id) {
       // Get model
       return PartialView(model);
 }

I usually add an extra parameter to the action, to check if the Action has been called using Ajax. If not, instead of the PartialView I return a View that includes the PartialView (I do this for accessibility, and to be sure that the web/app keeps working even if the Javascript failed).