Question

我正在编写一个jQuery网格插件，我设计它使它独立于所使用的语言。以下是我的插件分配方式的基础知识：

$("#grid").grid({
    enablePager: true,
    dataPath: "Movement/GetGridPage",
    columns: {
        Edit: { title: "", cellCallback: editButtonCallBack, width:"16px" },
        DocketNumber: { title: "Docket #" },
        SiteName: { title: "Site" },
        SiteAddress: { title: "Address" },
        SiteRegion: { title: "Region" },
    },
    cssTable: "table",
    cssAltRow: "altRow"
});

因为我想执行一些更高级的数据处理，而不仅仅用一些文本填充<td>，我添加了一个回调处理程序（cellCallback），它允许我有一个页面特定的函数特定的列数据。因此，在我的插件中，我执行以下操作：

var dataItem = currentRow[columnName];
if (columnSetting.cellCallback) {
    $td.html(columnSetting.cellCallback(dataItem));
}
else {
    $td.html(dataItem);
}

我遇到的问题是我的编辑列需要包含一些ImageActionLink（我的ActionLink的图像实现）。我不想在我的JSON响应中返回来自Controller的HTML，因为这是一个不必要的开销。

有没有什么好方法可以动态创建这些动作链接？目前，为了让它工作，我有这种令人难以置信的讨厌的方法：

function editButtonCallBack(data)
{
    var link = '<%= Html.ImageActionLink("Movement", "Edit", new { id = "X" }, 
        Url.Content("~/Content/Icons/Edit.png"), "Edit", null, null) %>';
    return link.replace("X", data);
}

因此，在每次回调中，我只是找到X并将data替换为代表要编辑的ID的{{1}}。

我知道这是错误，并且只要控制器或操作中有 X ，它就会中断。那我怎么能这样做呢？

Answer 1

怎么样：

function editButtonCallBack(data)
{
    var link = '<%= Html.ImageActionLink("Movement", "Edit", null, 
        Url.Content("~/Content/Icons/Edit.png"), "Edit", null, null) %>';

    var element = $('<div>' + link + '</div>');
    element.find('a').attr('id', data)
    return element.html();
}

这至少会对该特定属性执行替换，而不是对整个HTML块执行替换。（周围有“＆lt; div＆gt;＆lt; / div＆gt;”因为html（）只抓取内部 HTML。）

在JavaScript函数中使用HtmlHelper有正确的方法吗？

1 个答案: