Показать виды рядом друг с другом

Question

Я очень новичок в MVC, и, возможно, это его основная проблема.

Я создал контроллер под названием HomeController, который будет иметь представление, отображающее панель навигации, которая ведет себя как меню, но должна всегда отображаться как папки в проводнике Windows. При нажатии на элемент, я хочу загрузить другое представление в правую сторону (аналогично основной детали). Каждый элемент имеет вид и модель. Для того, чтобы загрузить панель навигации У меня есть следующий код

 @foreach (var service in Model.Services) 
     { 
      @Html.ActionLink(service.Label, "Details", new { serviceName = service.ServiceName }) 

     } 

Этот код работает отлично, но код открывает еще один вид, и мой список навигации исчезает. Пожалуйста, направляйте, как открыть мой подробный обзор вместе с Home view

Answer 1

Для этого вам необходимо использовать ajax.

Разделите свою страницу на 2 части. Левый контейнер div и правый предварительный просмотр div. Когда вы нажимаете на ссылку, используйте ajax для вызова этой ссылки и обновления DOM (предварительный просмотр div) той же страницы.

<div> 
    <div class="pageLeftMenuContainer"> 
     @foreach (var service in Model.Services) 
     {   
     @Html.ActionLink(service.Label, "Details", 
       new { serviceName = service.ServiceName },new { @class="ajaxLink"}) 
     } 
    </div> 
    <div class="pageRight" id="preview"></div> 
</div> 

Теперь прослушайте событие click по ссылкам с ссылкой ajax класса css и загрузите div предварительного просмотра. Вы можете использовать метод jquery load().

$(function(){ 
    $(".ajaxLink").click(function(e){ 
    e.preventDefault(); // prevent the normal link click behavior 
    $("#preview").load($(this).attr("href")); 
    }); 
});