フォームに大量のデータを表示する必要があります。多くは百の属性のようなもので、それぞれにユーザーが自分の知識レベルを置くために使用しなければならないカリフィケーション ランクがあります。低い、高い、良いなど。
私はこのような最初のものを実装しました
<h3>Conocimiento Informatico</h3>
<h5>Category Title</h5>
<div class="form-group">
@Html.LabelFor(model => model.IKOfficeCommunication, new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownListFor(model => model.IKOfficeCommunication.LevelSkillId, new SelectList(Model.InformaticSkillLevels, "SkillLevelID", "Name"), "Select Level")
@Html.ValidationMessageFor(model => model.IKOfficeCommunication)
@Html.HiddenFor(model=>model.IKOfficeCommunication.InformaticKnowledgeId)
</div>
</div>
そしてそれはうまくいきました。次に、少し調整して、bPopup jquery プラグインを使用して非表示および表示できる div に入れましょう。私の目的は、一度にすべての属性を表示するのではなく、フォームをより明確に表示できるようにすることです。
//Here is the category title that I use as the trigger for the model popup
<h5><a href="#" onclick="$('#divIKC0').bPopup(); return false;"> @Model.InformaticKnowledgeCategories[i].Name</a></h5>
//here is the hidden div, shown with bPopup plugin
<div id="divIKC0" style="background-color: #fff; border-radius: 5px; width: 60%;">
<div class="col-md-12">
<div class="form-horizontal">
<div>
<h4>Category Title</h4>
<a href="#" onclick="$('#divIKC0').bPopup().close(); return false;" style="float: right; bottom: 30px; position: relative;">Close</a>
</div>
<div class="form-group">
@Html.LabelFor(model => model.IKOfficeCommunication, new { @class = "control-label col-md-5" })
<div class="col-md-6">
@Html.DropDownListFor(model => model.IKOfficeCommunication.LevelSkillId, new SelectList(Model.InformaticSkillLevels, "LanguageSkillLevelID", "Name"), "Nivel")
@Html.ValidationMessageFor(model => model.IKOfficeCommunication)
@Html.HiddenFor(model => model.IKOfficeCommunication.InformaticKnowledgeId)
</div>
</div>
しかし、モデルがコントローラのポスト アクションに送り返されると、プロパティは null になります。
ページの読み込み時にdivを非表示にするために、ビューの最後にもこのスクリプトがあります。次に、bPopup プラグインがそれを表示または非表示にします。
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
@Scripts.Render("~/Scripts/jquery.unobtrusive-ajax.min.js")
@Scripts.Render("~/Scripts/chosen-ajax.js")
<script type="text/javascript">
$("#divIKC0").hide();
</script>
}
div が非表示のときにモデルがプロパティをロードしないのはなぜですか? どうすればこれを回避できますか?