Открыть всплывающее окно с шаблоном клиента в kendo ui razor

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

columns.Bound(c => c.ResumeFileUrl).EditorViewData(new { PartNo = "#: PartNo #" }).EditorTemplateName("ResumeFileUrlEditor").ClientTemplate("<a href='"  + "/#=Id#'>View Details</a>");

и мой jquery:

$("#mId").click(function () {
    $("#Proposal").data("kendoWindow").open();
});

и мое окно Кендо:

@(Html.Kendo().Window()
    .Name("Proposal")
    .Title("Proposal")
    .Iframe(true)
    .Visible(false)
    .Draggable()
    .Resizable()
)

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


javascript asp.net-mvc kendo-grid kendo-ui kendo-window
person Acnologia    schedule 20.02.2018    source источник
comment
вы получаете какую-либо ошибку в консоли браузера?   -  person Carlos Martins    schedule 20.02.2018
comment
Нет, я не получаю никакой ошибки.   -  person Acnologia    schedule 21.02.2018

Ответы (1)


arrow_upward
1
arrow_downward

Измените свой шаблон клиента на это:

"<a href='\\\\#' data-id='#=Id#'>View Details</a>"

Это напечатает ссылку вида: <a href='#' data-id='1'>View Details</a>. Затем измените свой jQuery на это:

$("[data-id]").on("click", function () {
    var id = $(this).data('id'); // Here's the Id of the item which user have clicked
    $("#Proposal").data("kendoWindow").open();
});

Что происходит?

  • Ссылка была настроена так, чтобы не иметь URL или действительной привязки (href="#"), поэтому нажатие на нее не приведет к каким-либо видимым действиям для пользователя;
  • Был добавлен атрибут данных для каждого элемента с именем id, поэтому вы можете получить к нему доступ с помощью .data("id") с помощью jQuery.

Теперь внутри события click у вас есть clicked id, и вы можете открыть с его помощью подробное представление.

person DontVoteMeDown    schedule 20.02.2018
comment
это не работает, я добавляю его как: ‹a href='\\\\#' data-id='#=PartNo#'›Просмотреть подробности‹/a›. Должен ли я что-то изменить в jQuery - person Acnologia; 21.02.2018
comment
@Acnologia ускользает от # в шаблоне кендо, это действительно сука, попробуй \\#. В худшем случае используйте вместо него href='javascript:void(0)'. - person DontVoteMeDown; 21.02.2018
comment
@Acnologia опишите, что вы имеете в виду, говоря, что это не работает. В вашем запросе много этапов, которые могут или не могут работать. Шаблон отображает ссылку Просмотреть подробности в порядке? Если да, событие клика работает? Если да, определяется id внутри события? И так далее... помогите мне помочь вам. - person DontVoteMeDown; 22.02.2018
comment
Извините, я сделал небольшую ошибку, теперь это работает. Спасибо за помощь @DontVoteMeDown - person Acnologia; 26.02.2018
comment
@Acnologia приятно знать!! Теперь, если ответ помог вам достичь цели, отметьте его как ответ на вопрос. - person DontVoteMeDown; 26.02.2018
comment
@Acnologia - если вы решили эту проблему, либо обновите свой вопрос с помощью кода, который работает, либо ответьте на свой вопрос правильным ответом, либо что-то в этом роде - у других людей может быть такой же вопрос, и они могут получить некоторую пользу от вашего решения: ) - person JayTee; 27.02.2018