Question

这是我从头开始的第一个MVC项目，我试图在首次加载时在视图中显示多个重复记录数据，然后允许用户在单击编辑按钮时编辑同一页面上的字段并保存该特定记录的数据。我有一些数据显示，但我觉得我的方式错了。

这是我的GeneRuleViewModel.cs

    public class GeneRuleViewModel
    {

    public virtual IEnumerable<GeneRule> GeneRules { get; set; }
    public virtual IEnumerable<GeneGroup> GeneGroups { get; set; }
    public List<KeyValuePair<int, string>> RuleDataStarDesignation { get; set; }
    public List<KeyValuePair<int, IEnumerable<SelectListItem>>> RuleDataPhenotype { get; set; }
    public List<KeyValuePair<int, bool>> RuleDataClinicallySignificant { get; set; }

    [DisplayName("Star Designation:")]
    public string StarDesignation { get; set; }
    [DisplayName("Phenotype:")]
    public string SelectedPhenotype { get; set; }
    [DisplayName("ClinicallySignificant?")]
    public bool ClinicallySignificant { get; set; }
    }

我使用了KeyValuePair，这样当循环浏览视图中的项目时，我可以知道哪个值属于特定的GeneRule_ID

这是我在GeneRuleController.cs中的Index（）方法，我从存储库填充KeyValuePairs

        public ActionResult Index()
    {
        var geneRules = generuleRepository.GetGeneRules();
        var geneGroups = generuleRepository.GetGeneGroups();

        List<KeyValuePair<int, string>> ruleStarDesignation = new List<KeyValuePair<int, string>>();
        List<KeyValuePair<int, IEnumerable<SelectListItem>>> rulePhenotype = new List<KeyValuePair<int, IEnumerable<SelectListItem>>>();
        List<KeyValuePair<int, bool>> ruleClinicallySignificant = new List<KeyValuePair<int, bool>>();


        foreach (var rule in geneRules)
        {
            rulePhenotype.Add(new KeyValuePair<int, IEnumerable<SelectListItem>>((int)rule.GeneRule_ID, generuleRepository.GetRulePhenotypes(rule)));
            ruleStarDesignation.Add(new KeyValuePair<int, string>((int)rule.GeneRule_ID, generuleRepository.GetRuleStarDesignation(rule)));
            ruleClinicallySignificant.Add(new KeyValuePair<int, bool>((int)rule.GeneRule_ID, generuleRepository.GetRuleClinicalSignificance(rule)));       
        }

        var generuleViewModel = new GeneRuleViewModel();
        generuleViewModel.GeneRules = geneRules;
        generuleViewModel.GeneGroups = geneGroups;
        generuleViewModel.RuleDataStarDesignation = ruleStarDesignation;
        generuleViewModel.RuleDataPhenotype = rulePhenotype;
        generuleViewModel.RuleDataClinicallySignificant = ruleClinicallySignificant;


        return View(generuleViewModel);
    }

这是我的Index.cshtml，我循环遍历每个GeneGroups和GeneRules以显示数据

    <div id="generulesgrid">
    <span class="glyphicon glyphicon-filter"></span>&nbsp;<span class="h4">Rule Filter</span>
    <div class="btn-group rulefilter">
        <button type="button" class="filter btn btn-default" data-filter="all">Show All</button>         
        @foreach (var geneGroup in Model.GeneGroups) {    
            <button type="button" class="filter btn btn-default" data-filter="@Html.DisplayFor(x => geneGroup.GeneGroup_NM)">@Html.DisplayFor(x => geneGroup.GeneGroup_NM)</button>
        }
    </div>


@foreach (var geneGroup in Model.GeneGroups) {    
    <div class="mix @Html.DisplayFor(x => geneGroup.GeneGroup_NM)">
        <div class="row">
            <div class="col-md-12">
                <div class="page-header">
                   <span class="glyphicon glyphicon-list"></span>&nbsp;<span class="h4">Gene Rules for <small>@Html.DisplayFor(x => geneGroup.GeneGroup_NM)</small></span>                
                </div>
            </div>
        </div>

        <div class="row">
            @foreach(var geneRule in Model.GeneRules.Where(x => x.GeneGroup_ID == geneGroup.GeneGroup_ID))
            {
                <div class="col-md-4">
                    @using (Html.BeginForm(null, "generule", FormMethod.Post, new { @class = "form-horizontal", @role = "form" }))
                    {
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                @Html.DisplayFor(x=> geneRule.GeneRule_NM) <span class="glyphicon glyphicon-edit pull-right editRule" data-toggle="tooltip" title="Edit Rule"></span>
                            </div>
                            <div class="panel-body">
                                <div class="form-group">
                                    @Html.LabelFor(x => x.StarDesignation, new { @class = "col-md-4 control-label" })
                                    <div class="col-md-8">
                                        @Html.TextBoxFor(x => x.StarDesignation, new {@Value = Model.RuleDataStarDesignation.Where(x => x.Key == geneRule.GeneRule_ID).FirstOrDefault().Value, @class = "form-control", @placeholder = "Enter Star Designation"})
                                    </div>
                                </div>

                                <div class="form-group">
                                    @Html.LabelFor(x => x.SelectedPhenotype, new { @class = "col-md-4 control-label" })
                                    <div class="col-md-8">
                                        @Html.DropDownListFor(x=>x.SelectedPhenotype,Model.RuleDataPhenotype.Where(x => x.Key == geneRule.GeneRule_ID).FirstOrDefault().Value,"select phenotype",new {@id = "generule_" + geneRule.GeneRule_ID + "_phenotype", @class = "form-control" })
                                    </div>
                                </div>
                                <div class="form-group">                                    
                                    @Html.Label("Rule Definition","Rule Definition:",new { @class = "col-md-4 control-label" })
                                    <div class="col-md-8">
                                    </div>
                                </div>

                                <div class="form-group">
                                    <div class="checkbox">
                                        <label>                                        
                                            @Html.CheckBoxFor(x=> x.ClinicallySignificant, Model.RuleDataClinicallySignificant.Where(y => y.Key == geneRule.GeneRule_ID).FirstOrDefault().Value)

                                        </label>
                                    </div>
                                </div>

                            </div>
                        </div>
                   }
                </div>    
            } 
         </div>
     </div> 


}
</div>

正如我所说，我觉得我的方式错误，所以任何帮助/建议都会受到高度赞赏。

Answer 1

对我来说看起来不错，我的方法会有所不同;我会为模型中的每个子列表创建一个局部视图，每个局部视图都采用一个简单的强类型列表。

但是，你的方式也可以。请记住（很多MVC新手都会犯这个错误），ViewModel在提交更改时不必匹配您绑定的模型。

如果你想要更加光滑，你可以使用AJAX并避免以后复杂的绑定（但你必须设置AJAX，这也需要一些时间）。

编辑：如果您想要最简单的方法，请在您要编辑的每个项目旁边放置一个带有正确ID的编辑按钮，这样可以非常轻松地找到您正在编辑的项目。

编辑2：这里有一个不错的例子：How to bind multiple textbox with ViewModel array string property?

在MVC视图中显示所有数据

1 个答案: