MVC 3 Razor Dropdown Изменить простой Javascript - PullRequest
2 голосов
/ 21 марта 2012

У меня есть приложение MVC3 Razor, которое я пытаюсь выполнить простым javascript при изменении раскрывающегося списка.

В моем представлении используется пользовательский помощник, который возвращает нужный объект в зависимости от типа данных (раскрывающийся список дляперечислимые списки, переключатели для двоичных файлов и т. д.)

Следующий помощник:

@Html.RecipeEditorFor(model => model.Coating_Mode)

, который отображает следующий список выбора в html:

<div class="form-line">
    <div class="editor-field">
        <select id="Coating_Mode" name="Coating_Mode">
             <option value="1">Adhesive</option>
             <option selected="selected" value="2">SR</option>
             <option value="3">Inspection</option>
        </select>
    </div>
</div>

Я хочуиметь простой javascript, выполняемый всякий раз, когда значение списка выбора изменяется:

<script type="text/javascript">
    $('#Coating_Mode').change(function () {
        alert("hello");
    }); 
</script> 

Я с удовольствием предоставлю любой другой код, необходимый для решения проблемы ...

Спасибо!

Ответы [ 2 ]

1 голос
/ 21 марта 2012

Попробуйте изменить скрипт на:

<script type="text/javascript">
    $(function () {
        $('#Coating_Mode').change(function () {
            alert("hello");
        });
    }); 
</script>

Кроме того, я бы советовал не использовать идентификатор в селекторе, если вы собираетесь использовать его в помощнике HTML.Вместо этого используйте селектор класса, если это требуется более чем одному элементу.

0 голосов
/ 21 марта 2012

Похоже, ваш скрипт работает до того, как DOM завершит загрузку, т. Е. Скрипт помещен перед вашим помощником.

Хорошей практикой является обертывание любых событий javascript внутри события готовности документа . Тогда сценарий может быть размещен где угодно (хотя в голове или прямо перед </body> наиболее подходящими). ​​

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

<script type="text/javascript">
    // This function won't fire until the DOM is completely loaded.
    $(document).ready(function() {

        $('#Coating_Mode').change(function () {
            alert("hello");
        }); 

    });
</script> 
...