JSON .append @ Html.Partial

Question

创建订单表时，需要加号，这会在订单中添加新行。 表的第一行总是在那里。 问题是第一个字段是Html.Partial视图，它处理所有可选项的下拉列表。

问题：如何将@ Html.Partial附加到JSON函数？ 问题：@符号。

function addOrderRow() {
        $("#btnAddOrderRow").click(function () {
              var newRow = '<tr style="height:50px;"><td class="col-md-6"><div class="row"><div id="SupplierItems" class="col-md-6">' +
                    '@Html.Partial("SupplierItems", Model)' +
                    '</div><div class="col-md-6"><input id="Description" type="text" class="form-control" style="width:100%" /></div></div></td><td class="col-md-3"><input id="Partnumber" type="text" style="width:100%" class="form-control" /></td><td class="col-md-2"><div class="form-inline"><strong>£&nbsp;</strong><input id="Cost" type="number" min="0" step="0.01" style="width:93%" class="form-control text-right" /></div></td><td class="col-md-1"><input id="Quantity" type="number" min="1" step="1" class="form-control text-center" value="1" style="width:100%" /></td><td class="col-md-1 text-center"><button class="btn btn-danger btn-sm" type="button"> <span class="glyphicon glyphicon-minus"></span></button></td></tr>';
              $("#orderTable > tbody:last-child").append(newRow);
        })
  };

如果我用@转义@函数，只需将@ Html.Partial（“SupplierItems”，M​​odel）文本放入相关的<td> 。

Answer 1

您可以将视图渲染为变量，然后使用它来添加行即ie

var view = '@Html.Raw(@Html.Partial('Your partial'))';

然后使用字符串连接添加视图

function addOrderRow() {
    var view = '@Html.Raw(@Html.Partial("SupplierItems", Model))';
    $("#btnAddOrderRow").click(function () {
          var newRow = '<tr style="height:50px;"><td class="col-md-6"><div class="row"><div id="SupplierItems" class="col-md-6">' +
                view +
                '</div><div class="col-md-6"><input id="Description" type="text" class="form-control" style="width:100%" /></div></div></td><td class="col-md-3"><input id="Partnumber" type="text" style="width:100%" class="form-control" /></td><td class="col-md-2"><div class="form-inline"><strong>£&nbsp;</strong><input id="Cost" type="number" min="0" step="0.01" style="width:93%" class="form-control text-right" /></div></td><td class="col-md-1"><input id="Quantity" type="number" min="1" step="1" class="form-control text-center" value="1" style="width:100%" /></td><td class="col-md-1 text-center"><button class="btn btn-danger btn-sm" type="button"> <span class="glyphicon glyphicon-minus"></span></button></td></tr>';
          $("#orderTable > tbody:last-child").append(newRow);
    })
};

注意这会创建一个静态视图，它会为每个添加的行呈现相同的内容，我发现一些视图依赖于给Inputs的ID，特别是在使用ModelBinding

Answer 2

似乎原始问题的答案是：

var view = String.raw`@Html.Partial("SupplierItems", Model)`;

记住标记，这不是' ！

但这对我没有帮助，因为局部视图包含另一个弄乱页面的<script> 。 我需要找到一个解决方法。 问题回答了。