0

我有一个 Javascript 字符串数组,我正在尝试创建一个 HTML 表来包含这些字符串以及它们旁边的下拉列表。

    $.each(data, function (key, val) {
        var tr = $("<tr></tr>");

        $("<td>"+ val + "</td>").appendTo(tr);
        var tmp = '<td>'+'@(Html.DropDownList("SomeDropdown", (SelectList)ViewBag.SomeList))'+'</td>';
        //var tmp = "<td><select><option value="0">Other</option></select> </td>";
        $(tmp).appendTo(tr);
        tr.appendTo("#tableData");
    });

使用 HTML 可以正常工作,但是当我使用 razor 尝试相同的事情时,我得到了异常:“未终止的字符串常量”。即使这样可行,新的问题将是所有 DropDownlists 在生成的 HTML 中都将具有相同的名称和 id。有没有更好的方法来实现这一点?


我想为我的 DropDownList 使用 Razor 的主要原因是使用我的 ViewBag。

这个想法是使用 HTML 和我的 ViewBag 创建一个下拉列表,并在需要的地方使用新的 id 克隆它。

Javascript:

        var i = 0;
    var prefix = 'pre';
    $.each(data, function (key, val) {
        var tr = $('<tr></tr>');

        var td = $('<td></td>');
        i++;
        var tmp = $("select:first").clone().attr("id", prefix+i);
        tmp.appendTo(td);
        td.appendTo(tr);
        $(td).appendTo(tr);

        tr.appendTo('#tableData');
    });

HTML(我将“原始”下拉菜单包装在隐藏的 div 中,因为它只需要复制):

<div style="display:none">
<select class="selector">
    @foreach (var item in ViewBag.SomeList)
    {
        <option value="@item.Value">
           @item.Text
        </option>
    }
</select>
</div>
4

2 回答 2

2

在这种情况下您不能使用 Razor,因为 Razor 用于服务器端在将其发送到客户端之前生成正确的 html。@Html.DropDownList不能这样执行,你的浏览器不理解。你最好坚持使用 html 解决方案。

如果你真的想为此使用 Razor,你可以向你的服务器发出一个 ajax 请求,它会返回一个包含 DropDownList 的局部视图,你可以将它插入到任何你想要的地方。但这意味着与您的服务器进行通信,这可能不是您想要做的。

于 2013-10-25T08:07:18.520 回答
0

我会选择你已经拥有的解决方案。但我认为你也可以使用剃须刀助手。像这样

<div id='hiddenDiv' style="display:none">
    @(Html.DropDownList("SomeDropdown", (SelectList)ViewBag.SomeList))
</div>

和你的 javascript

$.each(data, function (key, val) {
        var tr = $("<tr>");
        $("<td>"+ val + "</td>").appendTo(tr);
        $('<td>').append($("#hiddenDiv").find('select').first().clone().attr("id", prefix+(i++)).appendTo(tr);
        tr.appendTo("#tableData");
});
于 2013-10-27T19:49:51.953 回答