在ASP.NET MVC3中更新渲染视图的一部分

时间:2013-11-26 20:53:03

标签: c# asp.net-mvc asp.net-mvc-3

我有一个具有一些属性的模型:

public class AddComponentsDialogModel
{
    public string NameStartLabel { get; set; }
    [Required]
    public string NameStart { get; set; }

    public string NameEndLabel { get; set; }
    public string NameEnd { get; set; }

    public List<AttributeModel> Attributes { get; set; }

    public AddComponentsDialogModel()
    {
        NameStartLabel = "Name Start";
        NameEndLabel = "Name End";

        Attributes = new List<AttributeModel>();
    }
}

和相应的观点:

<% Html.BeginForm(); %>

    <div class="detailsRow required">
        <%= Html.LabelFor(model => model.NameStart, Model.NameStartLabel)%>
        <%= Html.EditorFor(model => model.NameStart) %>
    </div>
    <div class="detailsRow">
        <%= Html.LabelFor(model => model.NameEnd, Model.NameEndLabel)%>
        <%= Html.EditorFor(model => model.NameEnd)%>
    </div>

    <div class="attributesArea">
        <%= Html.EditorFor(model => model.Attributes) %>
    </div>

<% Html.EndForm(); %>

首次加载时,“属性”列表为空。因此,不会呈现任何属性视图。

然后我想从客户端发出一个ajax请求并更新attributesArea:

var attributeIDs = [1, 2, 3];
$('div.attributesArea').load('../Attribute/GetAttributeViews', $.param({ 
    attributeIDs: attributeIDs 
}, true));

[HttpGet, AjaxOnly]
public ActionResult GetAttributeViews(IEnumerable<int> attributeIDs)
{
    List<CSAttribute> attributes = new List<CSAttribute>();

    if (attributeIDs != null)
    {
        attributes.AddRange(AttributeCache.Instance.GetByIDList(attributeIDs));
    }

    List<AttributeModel> attributeModels = new List<AttributeModel>(attributes.Select(a => new AttributeModel(a)));

    return PartialView("EditorTemplates/AttributeModels", attributeModels);
}

虽然在视觉上加载的HTML是正确的,但它缺少适当的HTML标记以允许MVC模型绑定器理解

如果我将表单发回给我的控制器,它表示有0个属性,但应该有一些,因为我只刷新了HTML。

这样做的正确方法是什么?重新加载我的整个AddComponentsDialog视图似乎是不正确的,因为那样渲染子视图的重点是什么。

以下是我最初渲染时属性的HTML标记:

<div class="attributesArea">

    <input data-val="true" data-val-number="The field ID must be a number." data-val-required="The ID field is required." id="Attributes_0__ID" name="Attributes[0].ID" type="hidden" value="67">
    <input id="Attributes_0__Name" name="Attributes[0].Name" type="hidden" value="Memory">
    <input data-val="true" data-val-required="The DataType field is required." id="Attributes_0__DataType" name="Attributes[0].DataType" type="hidden" value="AlphaNumeric">
    <input data-val="true" data-val-number="The field DataLength must be a number." data-val-required="The DataLength field is required." id="Attributes_0__DataLength" name="Attributes[0].DataLength" type="hidden" value="20">
    <input class="component-alphanumeric component-editable" id="Attributes_0__Value" maxlength="20" name="Attributes[0].Value" type="text" value="">

</div>

如果我从GetAttributeViews加载它:

<div class="attributesArea">

    <input name="[0].ID" type="hidden" value="67">
    <input name="[0].Name" type="hidden" value="Memory">
    <input name="[0].DataType" type="hidden" value="AlphaNumeric">
    <input name="[0].DataLength" type="hidden" value="20">
    <input class="component-alphanumeric component-editable" maxlength="20" name="[0].Value" type="text" value="">

</div>

0 个答案:

没有答案