Question

我想动态地向我的表添加行：

 var tableRef = document.getElementById('tblData').getElementsByTagName('tbody')[0];
        var newRow = tableRef.insertRow(tableRef.rows.length);
        var newCell = newRow.insertCell(0);
        newCell.appendChild(document.createElement('input'));
        var newCell = newRow.insertCell(1);
        newCell.appendChild('@Html.DropDownList("AppVersionGroupId", string.Empty)');

但输出是：

newCell.appendChild('<select id="AppVersionGroupId" name="AppVersionGroupId"><option value=""></option>
<option value="46a08053-56e3-4320-aec3-7b521cca28ab">op1</option>
<option value="36ff6b7a-bdef-4506-b771-95cc42cd2667">op2</option>
<option value="e84fcfc5-8a46-47fd-8584-c00a5642f246">op3</option>
</select>');

我该如何使用html。!!!在我的javascript中？！

Answer 1

非常感谢你们。对我有用的答案是：

newCell.innerHTML = '@Ajax.JavaScriptStringEncode(Html.DropDownList("AppVersionGroupId", string.Empty).ToHtmlString())'

如果有任何问题，请告诉我。

Answer 2

您需要使用@Html.Raw和innerHtml JavaScript函数：

newCell.innerHtml = '@Html.Raw(Html.DropDownList("AppVersionGroupId", string.Empty)');

Answer 3

appendChild期望DOM node而不是String，所以您需要的是一个从给定HTML字符串创建DOM元素的函数

function createElementFromHtml(html){ 
  var div = document.createElement('div');
  div.innerHTML = html;
  return div.childNodes;
};

在主脚本中定义上述函数后，可以像这样调用它

var dropDown = createElementFromHtml('@Html.DropDownList("AppVersionGroupId", string.Empty)');
newCell.appendChild(dropDown); // <--- here DOMElement and not string

希望这有帮助！

参考文献：

在Javascript代码中使用Html.dropdownList（）

3 个答案: