Question

我的要求是我需要根据用户按下添加另一个按钮在动态div中显示局部视图。我尝试了下面的代码，但我无法实现它。

<html>
<head>
    <title>Index</title>
    <script type="text/javascript" src="../../Scripts/jquery-1.5.1.min.js"></script>
    <script type="text/javascript" src="../../Scripts/jquery-ui-1.8.11.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
        var i = 0;
            $("#chkAccecpt, #btnAccept").click(function () {
        i++;
        var divElement = "<br /><div id='container"+i+"'"+"> </div>";
                 $("#frmAccept").append(divElement);
                 $("#container1").load('@Url.Content("../../Views/Shared/UserInfoPartialView.cshtml")');
            });
        });
    </script>
</head>
<body>
    <div id="MainContent">
    <form id="frmAccept" method="post" action="#">
        <input type="checkbox" id="chkAccecpt" value="1" /> AddAnother
        <br />
        <input type="button" id="btnAccept" value="Add Another" />
        <br />
        <div id="userDetailsInfoContainer" class="Container">
            @Html.Partial("~/Views/Shared/UserInfoPartialView.cshtml")
        </div>
    // Here I need the dynamic container1 div  with that partial view controls also
     </form>
    </div>
</body>
</html>

Answer 1

我会考虑使用Ajax

获取部分视图

$.get("/urlToPartialViewAction",function(data){
   $("#container1").html(data);
});

这将为您添加视图并将其插入您选择的容器中。只需确保操作返回PartialView

即可

Answer 2

你为什么要从服务器打电话只是克隆容器

$('#container').clone().attr("id","container1").appendTo('#frmAccept');

并且您无法直接从浏览器访问视图，您必须为其添加操作。

Answer 3

您可以使用JQuery的Ajax方法轻松完成此操作。它还允许将参数发送到操作。

    $.ajax({
        url: "@Url.Action("YourActionName", "YourControllerName")",
        //data: {param1: value1, param2: value2} //add your parameters here
        success: function (data) {$("#container1").html(data)},
        error: $("#container1").html("")
    )}

如何使用jquery复制或重复局部视图

3 个答案: