Можно ли «обменивать» частичные виды одним нажатием кнопки?

Question

настоящее время у меня родительское представление с дизайном, как показано ниже:

+----------------------------------------------+ 
|     |   ___   | 
| ^   |   | \   | 
| /\   |   |___/   | 
| /---\   |   | \   | 
| / \   |   |___/   | 
|     |       | 
|--------------------+-------------------------| <--- Over View Of Page layout 
|     _____      | 
|     /      | 
|     |       | 
|     |       | 
|     \_____      | 
+----------------------------------------------+ 

Где A, B и «секции» C выполнены из частичных представлений.

В моем А разделе, у меня есть две кнопки и (в настоящее время) один частичный вид:

+----------------------------------------------+-------------------------------- 
| BUTTON 1 | BUTTON 2 |      | 
|------------------------+---------------------|    ______ 
|            |    |  \ 
|   <content here>      |    |  | 
|            |    |  |   
|            |    |------/   
|            |    |  \_________   
|            |   __________/ 
|           _____|__________/ 
|      _________________/ 
|   _____________/ 
|________/ 

       ^
        | 
        | 
     Close up of 'A' section 

Я в настоящее время имею кнопку 1 нажата и переключая видимость этой точки зрения, с помощью:

HTML

<button class="myBtn" onclick="toggle_visibility('btn1Partial');">Arm Details</button><a> 

Javascript:

<script type="text/javascript"> 
    function toggle_visibility(id) { 
     var e = document.getElementById(id); 
     if(e.style.display == 'block') 
      e.style.display = 'none'; 
     else 
      e.style.display = 'block'; 
    } 
</script> 

Однако я не могу найти способ достижения этой цели со второй кнопкой, так что первый частичный вид «удален» (не скрыт), а другой займет свое место.

Я уверен, что есть способ сделать это «правильно», используя шаблон MVC, но я не могу найти его! :(

Все, что я хочу сделать, это «обменивать» содержимое из раздела A с другим частичным представлением (очень похоже на вкладку, но частичные виды нужно будет «напомнить», когда они «появятся», чтобы отобразить большинство обновлена ​​информация - так просто скрытие/показ не будет действительно работать здесь)

Любые предложения

Редактировать

альтернативное направление этого вопроса может быть также «Как удалить частичный вид.? и открыть другое на своем месте? »

Answer 1

Это, по-видимому, обычное замешательство. Представления, частичные представления и т. Д. Применимы только тогда, когда вы на стороне сервера. После того, как ваша страница была отображена в браузере клиента, это просто веб-страница. Неважно, сколько частичных представлений у вас было, это всего лишь HTML в этот момент.

Итак, когда вы говорите о замене области на этой странице, вы говорите об обмене элементами DOM. Это означает, что вам нужно использовать JavaScript для выбора какого-либо элемента, например, div, который содержит контент, который вы хотите заменить. Затем каким-то образом получите новый HTML-контент и добавьте его в DOM, где выбранный вами элемент.Этот HTML-код можно создать на странице, или вы можете вернуться на сервер через AJAX для его получения. В вашем сценарии вы используете AJAX.

Чтобы использовать AJAX, вам нужна конечная точка на вашем сервере, которая вернет немного HTML. В условиях ASP.NET MVC это означает, что вам нужно действие, которое возвращает PartialView.

Answer 2

Да, вы можете это сделать.

Я сделал это с помощью функции jQuery load.

На кнопку мыши, просто $('#idOfDivHere').load(url...)

И это будет хлопнуть его прямо в заполнителем дел. URL нормальный controller/action и т. Д. - все, что вам нужно/нужно, чтобы html упал в ваш placeholder.

Конечно, есть возможность выбить вашу DOM, если вы загружаете вещи там, где их не должно быть, но если вы будете осторожны с частичным видом, это должно работать нормально.