Как использовать дочерние действия ASP.Net MVC с VS 2017 C # и MVC 5 - PullRequest
Новая
       38

Как использовать дочерние действия ASP.Net MVC с VS 2017 C # и MVC 5

0 голосов
/ 05 июля 2018

У меня есть сценарий, но я не знаю, возможно ли это сделать с помощью дочерних действий.

У меня нет кода для показа. По сути, в левой части представления будет простой список, содержащий сводные данные. В каждой строке списка также будет ссылка или кнопка «Просмотр сведений». Итак, я хочу, чтобы пользователь щелкнул по этой ссылке / кнопке, а затем справа я хочу, чтобы отображались дополнительные сведения о конкретном выбранном элементе. Затем пользователь может щелкнуть мышью на деталях просмотра для другого элемента и просмотреть эти детали и т. Д.

Как это лучше всего достигается в ASP.Net MVC?

Спасибо заранее.

1 Ответ

0 голосов
/ 06 июля 2018

Это пример для OP, это может или не может быть лучшим способом, но это будет работать:

Таким образом, на левой панели есть кнопки или ссылки, если текста вашей кнопки / ссылки достаточно для получения соответствующих данных с сервера, просто передайте их на сервер через Ajax, иначе, если вы хотите использовать идентификаторы или какой-то уникальный идентификатор, вы можете добавить это к свойству id ваших кнопок / ссылок, а затем передать его на сервер, я позволю вам решить, какой вы хотите использовать: 

//Example HTML
<div id="panelLeft">
   <button id="btnOne" class="btnInfo">Info on Cats</button>
   <br/>
   <button id="btnTwo" class="btnInfo">Info on Dogs</button>
</div>

//Assuming you are using JQuery
//Either in your page add a script tag with this code, or add a script file
//to your project and import it into your page (View)
$(function(){
      //Add click events to all your buttons by using the common className btnInfo
      $('.btnInfo').on('click', function(){
            const serverSideData = $(this).text(); //If you are using the text
            //of the button to find the info server side
            $.ajax({
                  url: "yourUrlToServerSideMethod",
                  type: "POST",
                  data: { yourServerSideParameter: serverSideData },
                  success: function(data){
                      //Successfully posted to server and got response
                      //If data is in JSON format, you can parse it with JSON.parse()

                      //Clear your div on the right which displays the item data
                      $('#divRightPanelInfo).html('');
                      $('#divRightPanelInfo).append(data); //If this is just a string
                      //Or create some pretty element(s) and append that to div

                  },
                  error: function(jqXHR, exception){
                      //Handle error, show error label or something
                  }
              });
       });
 });
...