Jak używać jquery w asp.net mvc 4?

Question

Pracuję na stronie przy użyciu ASP.Net 4 z MVC. Jestem bardzo zaznajomiony z WebForms & javascript i użyłem jquery, ale sprzedaż pakietowa jest myląca. Z tego, co wiem, wszystkie pliki javascript są zawinięte w plik BundleConfig.cs i pobrane z nagłówkiem w pliku site.master. Tak, powinienem być w stanie umieścić moje dodatkowe funkcje i wywołania jquery w nowych tagach.

Ale jest oczywiste, że sposób, w jaki funkcje jquery mają wejść do plików, są zupełnie inne niż to, do czego jestem przyzwyczajony, i nie mogę w ogóle uzyskać niczego do działania.

Czy są jakieś krótkie samouczki, które mogą pokazać mi właściwy sposób wykonania tego w MVC? A nie Razor, nie potrzebuję tutaj dwóch krzywych uczenia się.

Answer 1

Nie rozumiem twojego problemu, ale czy wiesz, jaki jest pakiet? Po pierwsze, spójrz na ten artykuł, aby zrozumieć pełną funkcję: http://www.asp.net/mvc/tutorials/mvc-4/bundling-and-minification

Nie musisz używać pakietów w asp.net mvc. Możesz po prostu usunąć go z projektu i dodać pliki javascripts na stronie układu bez problemów. Możesz dodać stronę do układu ręcznie i dodać swoje funkcje w innym pliku js i skleić widok (lub też układ). Asp.Net MVC to kolejna aplikacja w porównaniu z WebForms.

Razor jest Viewengine i można napisać kod po stronie serwera za pomocą @ char, dla próbki: @Html.TextBox("Name") że mamy od asp.net mvc 3, ale można również napisać silnik aspx dla próbki: <%: Html.TextBox("Name") %> jak ty coś w WebForms. (Polecam maszynę Razor, ponieważ szybciej jest pisać, czytać i używać).

Dowiedz się więcej o ViewEngines tutaj: http://weblogs.asp.net/scottgu/archive/2010/07/02/introducing-razor.aspx

Answer 2

Nie ma 'właściwy' sposób to zrobić w MVC, to do ciebie całkowicie.

Istnieje kilka typowych sposobów, aby to zrobić.

Można wstawiać funkcje JQuery 'inline' w obrębie swoich widoków, umieszczając je w etykietach script np. .

<script> 
    $('a').click(function() { alert("Click"); }); 
</script> 

to jednak nie jest zalecane, ponieważ sprawia, że ​​JS trudniejsze do zarządzania i ponowne wykorzystanie i bloats kod HTML. Prawdopodobnie zrobiłbyś to tylko wtedy, gdybyś miał naprawdę mały kawałek skryptu i nie czułeś, że warto było stworzyć nowy plik.

Ewentualnie możesz umieścić swój HTML w osobnych plikach js i dołączyć do nich odsyłacze do swoich widoków, np.

<script src="~/Scripts/mycusomtjquery.js"></script>

Jest lepiej, jak ma to umożliwić ponowne wykorzystanie i nie uwędzić kod HTML, plus przeglądarka jest w stanie go w pamięci podręcznej.

Jeszcze lepszą opcją jest skorzystanie z funkcji wiązania w MVC 4 i użycie tej funkcji. Umieść plik js w oddzielnym pliku, zarejestruj go jako pakiet i wyrenderuj go w widoku

np.

Utwórz plik js w oddzielnych plikach i umieść tam swój kod niestandardowy.

Place to w App_Start \ BundleConfig.cs

bundles.Add(new ScriptBundle("~/bundles/mycustomjquery") 
        .Include("~/Scripts/mycustomjquery.js") 
        .Include("~/Scripts/myothercustomjquery.js")); 

Dodaj wezwanie do renderowania zawiniątko w widoku

@Scripts.Render("~/bundles/mycustomjquery") 

To będzie świadczyć swoje js w sposób minfied i połączyła sposób, który może być buforowane przez broswer.

Można to skonfigurować, aby odpowiadał. Wybierz, jak spakować pliki js, ile rzeczywistych plików js utworzyć, gdzie je renderować itd.