在JCery的MVC4中将Json数据发送到@ Html.Actionlink()

时间:2013-11-29 12:29:19

标签: jquery json asp.net-mvc-4 razor html.actionlink

我在jquery的帮助下用json数据绑定html表。我成功地做到了这一点。 还希望通过传递来自Json Data的Id将actionlink通过jquery绑定到表中。 但是得到错误。

我搜索过它也经历了这篇文章 Embed Html.ActionLink in Javascript in Razor

如果我将静态ID传递给actionlink,那么本文的答案就有用了。但是给出了来自Json数据的id的错误。

下面是我的代码。

@{
    ViewBag.Title = "DeviceManagement";
}
<div class="acc-container" style="width:950px;">
        <fieldset>
            <br />
            <div class="container_12_840">
                <div class="grid_2" style="width: 230px;">Device Registered To</div>
                <div class="grid_3">
                    @Html.DropDownListFor(model => model.PersonId, Model.DeviceOwner, "-- Select Owner --",  new { id = "OwnerDrp" })
                </div>
                <div class="linebreak"></div>
                <br />
                    <div style="clear: both;">
                        <div id="search-form">
                            <table cellpadding="0" cellspacing="0" width="100%" id="table111">
                                <tbody>
                                    <tr>
                                        <th>Device Number</th>
                                        <th>Serial Number</th>
                                        <th>Type</th>
                                        <th>Owner</th>
                                        <th>Active</th>
                                        <th>Created</th>
                                        <th>Actions</th>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                <div class="rowspace"></div>
            </div>
        </fieldset>
    </div>

        <script>
                $(document).ready(function () {
                    $('#OwnerDrp').change(function () {
                        var id = $(this).val();
                        $.getJSON("/Device/GetModuelOwnerDevice", { Id: id },
                        function (data) {
                            $.each(data, function (i, obj) {
                       // this will work with static id
                               var setting = '@Html.ActionLink("Settings", "DeviceSetting", new { id = 1})';

                       // this will not work and give error saying "obj" not in scope
                               var setting = '@Html.ActionLink("Settings", "DeviceSetting", new { id = obj.DeviceInfoId})';

                                var html = "<tr><td style='text-align: center;'>" + obj.DeviceNumber + "</td>";
                                html += "<td style='text-align: center;'>" + obj.SerialNumber + "</td>";
                                html += "<td style='text-align: center;'>" + obj.Name + "</td>";
                                html += "<td style='text-align: center;'>" + obj.FirstName + "</td>";
                                html += "<td style='text-align: center;'>" + obj.Active + "</td>";
                                html += "<td style='text-align: center;'>" + obj.DateCreated + "</td>";
                                html += "<td style='text-align: center;'>" + setting + "</td>";
                                $("#table111 tr:last").after(html);
                            });
                        });
                    });

                });

            </script>

帮助将不胜感激。

1 个答案:

答案 0 :(得分:1)

您无法将JavaScript变量传递给Html.ActionLink

Html.ActionLink函数将呈现锚标记。我建议你手动渲染一个锚点,设置值就像

var url = '@Url.Action("DeviceSetting", "Controller", new { id = 1})';
url = url.replace("1", obj.DeviceInfoId)

添加

等链接
html += "<td style='text-align: center;'><a href='"+ url + "'>Settings</a></td>";