Модальное представление (частичное) из MVC.Grid - PullRequest
0 голосов
/ 29 января 2019

У меня есть cshtml страница (индекс), которая отображает Grid.MVC со строками данных.Когда пользователь нажимает на строку идентификатора, мне нужно отобразить всплывающее окно, которое предоставляет более подробную информацию.У меня есть точка останова в моем коде JavaScript, но он никогда не срабатывает.Сейчас код вызывает контроллер вместо функции.

cshtml код:

<div class="container-fluid">
    @Html.Grid(Model).Columns(columns =>
{
    columns.Add(c => c.task_id).Encoded(false).Titled("ID").Sanitized(false).Sortable(true).RenderValueAs(c => @Html.ActionLink(c.task_id.ToString(), "viewTransfers", new { taskId=c.task_id }, new { @onclick = "getTransfers('" + c.task_id + "')"}));
    columns.Add(c => c.company).Titled("Company");
})Filterable(false).WithPaging(int.Parse(EPH.Common.Util.GetConfigSetting("PageSize"))).Selectable(true)

</div>

<script type="text/javascript">
    $(function() {
        $('#getTransfers').click(function (e) {
            e.preventDefault();
            $(this).modal();
        });
    });
</script>

Контроллер:

public ActionResult ViewTransfers(int taskId)
{
    var myQuery = from transfers in db.fals_ftp_watcher_transfers
        where transfers.task_id == taskId
        orderby transfers.imp_date ascending
        select transfers;
    return View(myQuery);
}

1 Ответ

0 голосов
/ 29 января 2019

Здесь необходимо изменить пару вещей.

Ваш JavaScript ищет элемент dom с идентификатором getTransfers, а один не существует.

Iизменит его так, что генерируемые вами ссылки будут иметь класс getTransfers.

Ваша ссылка действия станет:

@Html.ActionLink(c.task_id.ToString(), 
    "viewTransfers", "controllerName", 
    new { taskId = c.task_id }, 
    new { @class = "getTransfers" })

Обратите внимание, что вам нужно будет изменить "controllerName"на имя вашего контроллера.

Ваш JavaScript станет:

<script type="text/javascript">
    $(function() {
        $('.getTransfers').click(function (e) {
            e.preventDefault();
            $(this).modal();
        });
    });
</script>
...