Помощники HTML в ASP.NET MVC 3 с действием Javascsript - PullRequest
2 голосов
/ 08 февраля 2012

У меня есть много помощников HTML в файле Helpers.cshtml, но некоторые из помощников (html) нуждаются в некотором действии jquery, так как я могу вызвать jquery внутри helpers.cshtml, возможно ли это?

iзнаю, что мы можем сохранить файл js в заголовке или на конкретной странице, но я не хочу так делать, я хочу использовать jquery или javascript только на той странице, на которой загружен конкретный помощник.

у кого-нибудь есть идеи на этот счет?Мой сценарий, у меня есть элемент управления списком, который корректно загружается из помощника, но мне нужно применить собственную тему к списку.

Немного больше ясности

//in index.cshtml
@Helpers.testListBox("mylist" "1,2,3,4,5,6,7")


//in Helpers.cshtml
@helper testListBox(string listName, string listData){

    //...... HTML code .........

    //Javascript here?

}

Ответы [ 3 ]

5 голосов
/ 08 февраля 2012

В веб-формах платформа может автоматически включать Javascript (один раз), когда на странице используются определенные серверные элементы управления; ASP.Net MVC не имеет такой возможности. Похоже, это то, что вам не хватает.

Способ сделать это на клиенте. Посмотрите на RequireJS http://requirejs.org/. Это клиентская библиотека для управления зависимостями Javascript. Это делает то, что сделали Web Forms, но лучше, и делает больше. Ваш основной макет будет иметь такой скрипт-тег:

<script src="/Scripts/require.js" type="text/javascript" data-main="/Scripts/main"></script>

Это может быть тег only *1009*, который вы включаете на каждой странице. Все остальное может быть загружено динамически только по требованию RequireJS. Это правда, что вы загружаете это на каждой странице, но оно меньше, чем jQuery, и оно занимает свое место, потому что так много делает для вас.

Используя ваш пример, допустим, у вас есть эта разметка:

@Helpers.testListBox("mylist" "1,2,3,4,5,6,7")

и он рендерит HTML и требует сценариев jQuery. Вы бы сделали это:

// HTML for list box here

<script type="text/javascript>
require(['jquery'], function($) {
  // Do your jQuery coding here:
  $("myList").doSomething().whatever();
});
</script>

Функция require загрузит jQuery, если он не был уже загружен, и затем выполнит ваш код. Это правда, что ваш фрагмент jQuery повторяется один раз при использовании помощника HTML, но это не имеет большого значения; этот код должен быть коротким.

RequireJS эффективно управляет зависимостями; у вас может быть модуль A и модуль B, который зависит от A, и модуль C, который зависит от B. Когда ваш клиентский код запрашивает модуль C, A и B будут загружены вместе с C, и в правильном порядке, и только один раз. каждый. Кроме того, за исключением начальной загрузки require.js, скрипты загружаются асинхронно, поэтому рендеринг вашей страницы не задерживается загрузкой скрипта.

Когда пришло время развернуть ваш сайт на веб-сервере, есть инструмент, который изучит зависимости между файлами Javascript и объединит их в один или небольшое количество файлов, а затем сведет их к минимуму. Ни одна из вашей разметки не должна измениться вообще. В процессе разработки вы можете работать с множеством небольших модульных файлов Javascript для простой отладки, а при развертывании они объединяются и минимизируются для повышения эффективности.

Это намного лучше, чем то, что делал фреймворк веб-форм, и полностью на стороне клиента, что, на мой взгляд, и относится к этому.

0 голосов
/ 08 февраля 2012

Как насчет этого для примера частичного просмотра:

@model Member.CurrentMemberModel
@{

    var title = "Test View";
}

        <script type="text/javascript">
            // Javascript goes in here, you can even add properties using "@" symbol
            $(document).ready(function () {
                //Do Jquery stuff here
            });
        </script>

@if (currentMember != null)
{
     <div>Hello Member</div>
}
else
{
    <div>You are not logged in</div>
}
0 голосов
/ 08 февраля 2012

Вы можете поместить тег <script> в тело помощника.

...