如何从Kendo将参数传递给javascript函数<a href=“”></a>

Question

这是我具有onclick function（）的<href>标记的kendo网格。现在我想将文件名作为参数传递给我的onclick函数。我想将该文件名作为参数传递给CallAjaxMethod函数。 怎么办？

@(Html.Kendo().Grid<MVCAPPModels..AttachmentsModel>()
        .Name("grid")
        .Columns(columns =>
        {   
            columns.Bound(p => p.FileName).ClientTemplate("<a id='FileName' href='\\#' data-pdfurl='#= FileName #' onclick='CallAjaxMethod('#= FileName #');'>/#= FileName #</a>");

            columns.Bound(c => c.CreatedDate).Width(70);
            columns.Bound(c => c.CreatedBy).Width(70);
            columns.Bound(c => c.UpdatedDate).Width(70);
            columns.Bound(c => c.UpdatedbBy).Width(70);
        })

        .HtmlAttributes(new { style = "height: 350px;" })
        .Scrollable()
        .Groupable()
        .Sortable()
        .Pageable(pageable => pageable
            .Refresh(true)
            .PageSizes(true)
            .ButtonCount(1))
        .DataSource(dataSource => dataSource
            .Ajax()
                      .ServerOperation(false)

            .Read(read => read.Action("Customers_Read", "Home"))
        )
)

JavaScript函数：

function CallAjaxMethod()
    {
        alert("page! CallAjax");
        $.ajax({
            type: "POST",
            url: "@Url.Action("Submit", "Home")",
            data: { fileName: "/pdfSample.pdf" },
            type: 'GET',
            cache: false,
            success: function (result) {
                        $('#partialView_div').data(result);
            }
        });
    }

Answer 1

首先，向函数添加参数，以便您可以实际使用传入的内容：

function CallAjaxMethod(filename)
{
    alert("page! CallAjax");
    $.ajax({
        type: "POST",
        url: "@Url.Action("Submit", "Home")",
        data: { fileName: filename },
        type: 'GET',
        cache: false,
        success: function (result) {
                    $('#partialView_div').data(result);
        }
    });
}

然后您的HTML和Javascript引号相互冲突，因为它们都是单引号，因此您需要更改其中一些，最好是HTML引号：

@(Html.Kendo().Grid<MVCAPPModels.AttachmentsModel>()
        .Name("grid")
        .Columns(columns =>
        {   
            columns.Bound(p => p.FileName).ClientTemplate("<a id=\"FileName\" href=\"\\#\" data-pdfurl=\"#= FileName #\" onclick=\"CallAjaxMethod('#= FileName #');\">/#= FileName #</a>");

            columns.Bound(c => c.CreatedDate).Width(70);
            columns.Bound(c => c.CreatedBy).Width(70);
            columns.Bound(c => c.UpdatedDate).Width(70);
            columns.Bound(c => c.UpdatedbBy).Width(70);
        })

        .HtmlAttributes(new { style = "height: 350px;" })
        .Scrollable()
        .Groupable()
        .Sortable()
        .Pageable(pageable => pageable
            .Refresh(true)
            .PageSizes(true)
            .ButtonCount(1))
        .DataSource(dataSource => dataSource
            .Ajax()
                      .ServerOperation(false)

            .Read(read => read.Action("Customers_Read", "Home"))
        )
)