asp.net MVC - Как сделать страницу мастера/подробностей

Question

Я хочу создать страницу мастера/детали. Я вижу, что он работает одним из двух способов:

• Щелчок по строке в сетке снова вызывает ту же страницу с добавлением панели сведений.
• Нажав на строку, javascript/JSON вызовет действие контроллера, которое возвращает данные и заполняет панель.

Я хотел бы выделить выделенную строку. Выбранная строка может быть несколькими страницами в сетчатую сетку.

Звуки легко. К сожалению, я новичок в asp.net MVC, и я не опытный программист. Однако я могу следовать и адаптировать примеры. Я был бы признателен за примеры обоих вышеупомянутых методов, которые помогут мне изучить MVC.

Заранее спасибо.

Answer 1

Чтобы ответить на мой собственный вопрос:

Я закончил с использованием PartialViews и JQuery.

Нажав на ссылку выбора по строке, вы добавите новую строку под выбранную (используя jQuery). В эту строку я использую jQuery для GET/PurchaseOrder/Detail (PartialView).

Вот мой Javascript:

function GetDetails(id, enableEdit) { 

     var detailsRowExists = $().find("#detailsRow").size(); 

     if (detailsRowExists) { 
      // Delete details row 
      // Note: need to rename id for row to be deleted 
      // because jQuery does not wait for the row to be 
      // deleted before adding the new row. 
      $("#detailsRow").attr("id", "detailsRowOld"); 
      $("#detail").slideUp("normal", function() { 
       $("#detailsRowOld").remove(); 
      }); 
     }; 


     // Put new row below selected one 
     $("tr[id=" + id + "]").after("<tr id='detailsRow'><td colspan='4'><div id='detail'><img src='../../Content/wait20trans.gif' />Loading...</div></td></tr>"); 

     // Pull details into new row 
     $.get("/PurchaseOrder/Detail/" + id, { enableEdit: enableEdit }, 
      function(data) { 
       $("#detail").hide(); 
       $("#detail").html(data); 
       $("#detail").slideDown("normal"); 
      } 
     ); 

    } 

Надеемся, что это может, помогает другим, пытаясь достигнуть страницы мастера/подробности.