Почему javascript не работает в представлении asp.net mvc с общим / частичным представлением - PullRequest
Новая
       3

Почему javascript не работает в представлении asp.net mvc с общим / частичным представлением

0 голосов
/ 30 августа 2018

Я попытался добавить следующий скрипт в конец моего представления Index.cshtml для моей страницы пользователей, но он не вызывается. Я попытался обернуть это в $(document).ready(function () { и т. Д., Но, похоже, это не имеет никакого значения. 

<script>
    $("#UserSearch").click(function () {
        $("#usernameSearchString").text("newText");
    });
</script>

Ниже приведено представление Index.cshtml: 

@model IEnumerable<CCM.Models.User>

    <script src="~/Scripts/jquery.unobtrusive-ajax.min.js"> </script>

@{
    ViewBag.Title = "Users";
    ViewBag.CurrentSort = "name_desc";
    ViewBag.NameSortParm = "name_desc";
    ViewBag.DateSortParm = "date_desc";
}

<p class="h2">Manage Users</p>
<input type="text" id="usernameSearchString" placeholder = "Find by user name" class="form-input" />
<a id="UserSearch" class="CMsubmit">Search</a>
<br />
<br />
<div id="usersTable" style="overflow-x:auto;">
    @Html.Partial("_User", Model)
</div>
<script>
    $("#UserSearch").click(function () {
        $("#usernameSearchString").text("newText");
    });
</script>

Поскольку страница использует общее представление для навигации, ссылки JQuery были сохранены в общем представлении _Layout.cshtml следующим образом. Я обнаружил, что добавление ссылки JQuery в мое представление Index.cshtml приводило к двойному срабатыванию функций JQuery. 

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title - CCM</title>
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/modernizr")
</head>
<body>
...navigation...
</body>
</html>

Частичное представление _User.cshtml также вызывается для заполнения таблицы, частичное представление не содержит ссылок на JQuery и не использует javascript.

Приведенный выше скрипт является лишь примером, javascript / JQuery требуется в представлении Index.cshtml, чтобы я мог передать строку фильтра поиска функции в Controller, чтобы обновить частичное представление с отфильтрованными результатами.

Однако мой вопрос заключается в том, как мне заставить встроенный javascript / JQuery вообще работать в моем представлении Index.cshtml?

1 Ответ

0 голосов
/ 30 августа 2018

Поскольку UserSearch является ссылкой, я считаю, что проблема в том, что ваш скрипт работает, но затем щелчок также вызывает поведение ссылки по умолчанию, поэтому вы не можете заметить, что ваш пользовательский скрипт работает. Вы можете подтвердить это, поместив точку останова отладки в свой скрипт и посмотрев, останавливается ли выполнение страницы после щелчка.

Таким образом, вам нужно предотвратить поведение по умолчанию. Это довольно стандартно для jQuery: 

$("#UserSearch").click(function (event) {
    event.preventDefault();
    $("#usernameSearchString").val("newText");
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...