使用BeginCollectionItem不返回索引的部分显示

Question

更新代码--如果我使用一个按钮，那么AJAX调用就不能工作，在chrome调试中永远不会点击，如果我使用动作链接尝试添加它自己发送给部分视图的部分视图，而不是按预期在索引中。

<input type="button" id="addItem" value="Add" />

而不是

@Html.ActionLink("Add", "RequestedIpManager", null, new {id = "addItem"});

试图通过使用在线指南中更复杂的模型结构来将BeginCollectionItem付诸实践。

我已经取消了after按钮的行为--它在转到分部后不会返回到索引。

因此，我在部分视图中结束，处理代码的方式与处理here的方式相同。

我怎样才能让它回到指数呢？唯一的区别是索引模型，它不是IEnumerable，但是对象是，我使用它不正确吗？

代码：

指数

@model Project.Models.Pa_Ipv4
@{
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<div class="ui-block-a">
                    <p>Company Name</p>
                    <span>
                        @Html.EditorFor(m => m.companyDetails.name)
                        @Html.ValidationMessageFor(m => m.companyDetails.name)
                    </span>
                </div>
@using (Html.BeginForm())
            {
                <div id="editorRows">
                    @foreach (var item in Model.requestedIps)
                    {
                        @Html.Partial("ReqIpView", item)
                    }
                </div>
                <div data-role="controlgroup" data-type="horizontal">
                    <input type="button" id="addItem" value="Add" />
                </div>
            }
            <br />
@section scripts
{
    <script type="text/javascript">
            $("#addItem").click(function() {
                $.ajax({
                    url: @Url.Action("RequestedIpManager"),
                    cache: false,
                    success: function(html) { $("#editorRows").append(html); }
                });
                return false;
            });
            $('#editorRows').on('click', '.deleteRow', function() {
                $(this).closest('.editorRow').remove();
            });
    </script>
}

部分

    @model Project.Models.IpAllocation
@using HierarchicalControlsDemo.Helpers
<div class="editorRow">
    @using (Html.BeginCollectionItem("requestedIps"))
    {
        <div class="ui-grid-c ui-responsive">
            <div class="ui-block-a">
                <span>
                    @Html.TextBoxFor(m => m.subnet)
                </span>
            </div>
            <div class="ui-block-b">
                <span>
                    @Html.TextBoxFor(m => m.cidr)
                </span>
            </div>
            <div class="ui-block-c">
                <span>
                    @Html.TextBoxFor(m => m.mask)
                </span>
            </div>
            <div class="ui-block-d">
                <span>
                    <a href="#" class="deleteRow">Dlt</a>
                </span>
            </div>
        </div>
    }
</div>

控制器

public ActionResult Index()
        {
            Pa_Ipv4 paipv4 = new Pa_Ipv4
            {
                requestedIps = new List<IpAllocation>
                {
                    new IpAllocation {cidr = "", mask = "", subnet = "", allocationType = "requestedIp"}
                },
                existingIps = new List<IpAllocation>
                {
                    new IpAllocation {cidr = "", mask = "", subnet = "", allocationType = "existingIp"}
                }
            };
            return View(paipv4);
        }
public ViewResult RequestedIpManager()
        {
            return View("ReqIpView", new IpAllocation());
        }

模型-为了清晰起见

    public class Pa_Ipv4
    {
        public Details companyDetails { get; set; } // just a basic holding class for company input
        public List<IpAllocation> requestedIps { get; set; }
    }
public class IpAllocation
    {
        [Key]
        public int id { get; set; }
        [Required]
        public string allocationType { get; set; }
        [Required]
        public string subnet { get; set; }
        [Required]
        public string cidr { get; set; }
        [Required]
        public string mask { get; set; }
    }

Answer 1

这有几个小问题。

ajax无法正常工作，因为@url.action(actionName)没有在浏览器上返回字符串值，而浏览器上的字符串值不是valied调试器。

编辑-更改为最佳实践网址。

为了避免这种情况，您的部分脚本应该如下所示：

$(function() { $('#addItem').on('click', function() { $.ajax({ url: 'Url.Action("RequestedIpManager")', cache: false, success: function(html) { $("#editorRows").append(html); } }); return false; }); });

然后在您的控制器中，按其原样进行以下更改--您的控制器正在返回一个完整的视图，因此当单击实际工作时，您将得到一个完整的页面：

public ActionResult RequestedIpManager() { return PartialView("ReqIpView", new IpAllocation()); }