如何使用MVC4动态Html输入

本文关键字:Html 输入 动态 MVC4 何使用 | 更新日期: 2023-09-27 18:09:38

我是新的MVC和使用MVC4。我有一系列用AJAX调用填充的级联下拉列表。Customer> Family> Assembly -程序集决定我需要用户填写多少Baluns(带有属性的对象),Baluns对象的数量是基于该程序集的需求。

我为每个项目创建了一个单独的对象,并为这个视图创建了一个视图模型。然后,我将listOfBaluns传递给一个局部视图来循环并创建所需的HTML。

当我提交表单时,我总是只看到第一个Balun对象的属性。从我的理解,我使用的部分视图正确地循环通过Balun对象的列表,但那些不出现在帖子无论是FormCollection或在Request.Form.

在我包含的代码中,我只是测试,看看我是否可以得到2 balunrecords工作,这应该解释为什么我显式地添加2 balunrecords到视图模型中的列表。

如有任何帮助,不胜感激。

这里是视图-

@model Nortech_Intranet.ViewModels.BalunTuningEntryViewModel
@using Nortech_Intranet.Models.BalunModels
@using (Html.BeginForm()) {
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)
    <div class="whiteBodyContainer">
        @*Text Entry fields*@
        <table style="margin: auto;">
            <tr>
                <th>
                    @Html.LabelFor(model => model.balunTuningRecord.Start_Timestamp)
                </th>
                <td>
                    @Html.TextBoxFor(model => model.balunTuningRecord.Start_Timestamp, new { @Value = @System.DateTime.Now } )
                </td>
                <th>
                    @Html.LabelFor(model => model.balunTuningRecord.Work_Order)
                </th>
                <td>
                    @Html.TextBoxFor(model => model.balunTuningRecord.Work_Order)
                </td>
                <th>
                    @Html.LabelFor(model => model.balunTuningRecord.Serial_Number)
                </th>
                <td>
                    @Html.TextBoxFor(model => model.balunTuningRecord.Serial_Number)
                </td>
            </tr>
        </table>
        <hr />    
        <table style="margin: auto;">
            <tr>
                @Html.Partial("_RenderBalun", Model.balunList)
            </tr>
        </table>
    </div>
    <p>
        <input type="submit" value="Create Tuning Record" />
    </p>
}

ViewModel——

using Nortech_Intranet.Models.BalunModels;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
namespace Nortech_Intranet.ViewModels
{
    public class BalunTuningEntryViewModel
    {
        public List<Customer> customerList { get; set; }
        public List<Family> familyList { get; set; }
        public List<Assembly> assemblyList { get; set; }
        public List<NWAnalyzerModel> nwAnalyzerModelList { get; set; }
        public List<NWAnalyzerCAL_ID> nwAnalyzerCAL_IDList { get; set; }
        public List<TestUser> testUserList { get; set; }
        public List<BalunRecord> balunList { get; set; }
        public BalunTuningRecord balunTuningRecord { get; set; }
        public BalunTuningEntryViewModel() : base ()
        {
            balunList = new List<BalunRecord>();
            BalunRecord newRecord = new BalunRecord();
            balunList.Add(newRecord);
            BalunRecord newRecord2 = new BalunRecord();
            balunList.Add(newRecord2);
        }
        public BalunTuningEntryViewModel(int i)
        {
            balunList = new List<BalunRecord>();
            for (int counter = 0; counter < i; counter++)
            {
                BalunRecord newRecord = new BalunRecord();
                balunList.Add(newRecord);
            }
        }
    }
}

局部视图-

@model IEnumerable<Nortech_Intranet.Models.BalunModels.BalunRecord>
@using Nortech_Intranet.Models.BalunModels
@{
    int counter = 1;
    foreach(BalunRecord record in Model)
    {
    <td>
        <table id="@("tblBalun"+@counter)"  style="border: 2px solid gray; visibility: collapse;">
            <tr>
                <th colspan="2" style="text-align: center;"><label>Balun #@counter</label></th>
            </tr>
            <tr>
                <th>
                    @Html.LabelFor(model => record.Tuning_Cap_1)
                </th>
                <td>
                    @Html.TextBoxFor(model => record.Tuning_Cap_1, new { id = "ddlBalun" + @counter + "Cap" + "1" })
                </td>
            </tr>
            <tr>
                <th>
                    @Html.LabelFor(model => record.Tuning_Cap_2)
                </th>
                <td>
                    @Html.TextBoxFor(model => record.Tuning_Cap_2, new { id = "ddlBalun" + @counter + "Cap" + "2" })
                </td>
            </tr>
        </table>
    </td>       
        counter = counter + 1;
    }
}

如何使用MVC4动态Html输入

我弄明白了,解决方案是循环并使用模型的索引。下面是视图中解决问题的新部分-

@{
    var counter = 1;
    for (int i = 0; i < Model.balunList.Count; i++)
    {
    <td>
    <table id="@("tblBalun" + @counter)"  style="border: 2px solid gray; visibility: collapse;">
        <tr>
            <th colspan="2" style="text-align: center;"><label>Balun #@counter</label></th>
        </tr>
        <tr>
            <th>
                @Html.LabelFor(model => model.balunList[i].Tuning_Cap_1)
            </th>
            <td>
                @Html.TextBoxFor(model => model.balunList[i].Tuning_Cap_1, new { id = "ddlBalun" + @counter + "Cap" + "1" })
            </td>
        </tr>
        <tr>
            <th>
                @Html.LabelFor(model => model.balunList[i].Tuning_Cap_2)
            </th>
            <td>
                @Html.TextBoxFor(model => model.balunList[i].Tuning_Cap_2, new { id = "ddlBalun" + @counter + "Cap" + "2" })
            </td>
        </tr>
    </table>
    </td>
        counter++;
    }   
}