在下拉列表更改时,将EditorTemplates动态添加到当前页面

时间:2012-01-12 15:34:35

标签: asp.net-mvc-3 razor

我目前有一个3步向导。

第1步:获取我需要的一些详细信息,并在下拉列表中选择包数

第2步: 根据您选择的包数量,此步骤将显示包所需的编辑器数量

第3步:确认您的订单

我被告知我需要结合第1步和第1步。 2但是我对mvc和razor如何做到这一点感到茫然,因为它只是你模特的VIEW ......

这样做的最佳方式是什么?

是否会将页面提交回自身,并指定需要多少包的操作,或者可以使用ajax完成此操作?

谢谢

1 个答案:

答案 0 :(得分:2)

我的方法如下:

为包行创建一个部分(PackageRow.cshtml)

@model IEnumerable<PackageViewModel>
<div class="editorRow">
@using (Html.BeginCollectionItem("packages"))
{
    @Html.TextBoxFor(x => x.WhateverYouNeed) 
}
</div>

在用户选择行数时,通过ajax将包行加载到表单中

@Html.ActionLink("Go!", "AddPackages", null, new { id = "addPackages" })

<div id="editorRows"></div>

<script type="text/javascript">
$(document).ready(function () {
        $("#addPackages").click(function () {
            $.ajax({ url: this.href, cache: false, success: function (html) {
                $("#editorRows").append(html); // add the number of rows you need here
            }
            }); return false;
        });
        $("a.deleteRow").live("click", function () { $(this).parents("div.editorRow:first").remove(); return false; });
    });  
</script>   

通过控制器将部分内容添加到表单

public ActionResult AddPackages()
{
    return PartialView("PackageRow", new PackageViewModel { ... });
}

保存数据

 [Authorize]
 [HttpPost]
        public ActionResult CreatePackages(int id, FormCollection fc)
        {

            int nrKeys = fc.AllKeys.Count();
            int i = 0;

            int interations = (nrKeys / 2);

            foreach (var key in fc.AllKeys)
            {

                if (nrKeys <= i)
                    break;

                if (i != 0)
                {
                    string value1 = fc[i];
                    string value2 = fc[i + 1];
                   ...
                }
                else
                {
                    i++;
                }

           ...