使用MVC

Question

我有一个Razor View，其中有一个部分，用户可以在特定日期为临时开启/关闭时间添加新行。它由三个控件组成 - 一个DatePicker，两个Select列表和一个＆＃34;删除行＆＃34;按钮。现有的已保存行通过Razor在页面加载时呈现，并且任何新行都通过OnClick事件添加，并且JavaScript将大部分固定的html附加到DOM元素。然后在HTTPPost上保存（或根据需要删除）所有行。

我有一个新的要求，要求为这些ad-hoc实现更复杂的数据集，用户生成的＆＃34;行。每个行的HTML都很广泛。是否有更优雅的方式在按钮点击的视图中注入Razor而不是在JavaScript中附加硬编码的HTML？

Answer 1

这完全取决于您的使用案例，并且您未在问题中提供任何代码，但有一些名为Partial View的内容。您可以阅读基本介绍here。

对于你的情况，我做这样的事情：

<强>控制器

public IActionResult GetNewRow()
{
    return PartialView("_NewRow");
}

查看

<button id="btnAddRow" class="btn btn-primary">Add new row</button>

<script type="application/javascript">
    $(function() {
        $("#btnAddRow").on("click", function () {
            $.get("/GetNewRow", function success(data) {
                $("#WHEREVERYOUAREADDINGROWS").append(data);
            });
        });
    });
</script>

PartialView（_NewRow）

<tr>
    <td>Add whatever you need here</td>
<tr>

注意：我没有尝试这样做，因此AJAX语法可能有些偏差。