Jak renderować widok częściowy za pomocą jquery?
Możemy renderować częściowy widok w następujący sposób:
<% Html.RenderPartial("UserDetails"); %>
Jak możemy zrobić to samo za pomocą jquery?
Jak renderować widok częściowy za pomocą jquery?
Możemy renderować częściowy widok w następujący sposób:
<% Html.RenderPartial("UserDetails"); %>
Jak możemy zrobić to samo za pomocą jquery?
Odpowiedzi:
Nie można renderować widoku częściowego przy użyciu tylko jQuery. Możesz jednak wywołać metodę (akcję), która wyświetli widok częściowy i doda go do strony przy użyciu jQuery / AJAX. Poniżej znajduje się moduł obsługi kliknięcia przycisku, który ładuje adres URL działania z atrybutu danych na przycisku i odpala żądanie GET, aby zastąpić DIV zawarty w widoku częściowym zaktualizowaną zawartością.
gdzie kontroler użytkownika ma akcję o nazwie szczegół, która:
Zakłada się, że częściowy widok jest kontenerem o identyfikatorze,
detailsDiv
więc wystarczy zastąpić całą rzecz zawartością wyniku wywołania.Przycisk widoku rodzica
User
to nazwa kontrolera idetails
nazwa akcji w@Url.Action()
. Widok częściowy UserDetailsźródło
W tym celu wykorzystałem ładowanie ajax:
źródło
UserDetails
nazwa akcji nie jest częściowym widokiem, prawda?@Url.Action("ActionName","ControllerName", new { area = "AreaName" } )
robi zamiast Handcoding .@tvanfosson kołysze swoją odpowiedzią.
Sugerowałbym jednak ulepszenie js i małą kontrolę kontrolera.
Kiedy użyjemy
@Url
pomocnika do wywołania akcji, otrzymamy sformatowany HTML. Lepiej byłoby zaktualizować content (.html
), a nie faktyczny element (.replaceWith
).Więcej informacji na stronie: Jaka jest różnica między jQuery's replaceWith () i html ()?
Jest to szczególnie przydatne w drzewach, w których zawartość można zmieniać kilka razy.
W kontrolerze możemy ponownie wykorzystać akcję w zależności od requestera:
źródło
Kolejną rzeczą, którą możesz wypróbować (na podstawie odpowiedzi tvanfosson), jest:
A następnie w sekcji skryptów na stronie:
To renderuje twoją @ Html.RenderAction za pomocą ajax.
Aby wszystko było fanowskie, możesz dodać efekt przenikania za pomocą tego css:
Man I love mvc :-)
źródło
<div class="renderaction fade-in" ...></div>
elementów.Musisz utworzyć akcję na kontrolerze, która zwróci renderowany wynik częściowego widoku lub kontroli „UserDetails”. Następnie wystarczy użyć polecenia Pobierz lub Wyślij z jQuery, aby wywołać akcję, aby wyświetlić renderowany HTML.
źródło
Korzystanie ze standardowego wywołania Ajax, aby osiągnąć ten sam wynik
źródło
Zrobiłem to w ten sposób.
Metoda szczegółowa:
źródło
Jeśli potrzebujesz odwoływać się do dynamicznie generowanej wartości, możesz również dołączyć parametry ciągu zapytania za @ URL.
źródło