2
jqueryポップアップウィンドウのコンテンツになるはずの部分的なビューがあります。これには、50クラス* 200学生= 10000チェックボックスなど、多くのチェックボックスが含まれています。ユーザーがメインビューで1つのトレーニングをクリックすると、ポップアップが開き、クラス（10 000のチェックボックス）ごとに学生を選択するオプションが表示されます。最初に私はAjaxを使用するためにクリックしてトレーニングを試してみました。すべての組み合わせ（チェックされているとチェックされていません）を取得し、ポップアップの親divに追加します。しかし、問題は次のように追加することでした：多くのチェックボックスが表示されたポップアップのレンダリングが遅いです
$("#choose-students-by-class-dialog").append(response);
は約13秒を要しました。これは遅くて耐えられません。 クラスと生徒の組み合わせが同じなので、最初のページの読み込み時にそのポップアップ（部分表示）をレンダリングすることにしました。トレーニングでは、すでにチェックされている組み合わせをチェックしてポップアップを表示します。だから私はこのような部分的なビューをレンダリングしました：しかし、最初のページのレンダリングが長すぎてページが応答しなくなりました。
誰も私に何をすべきか教えていただけますか？ここで
は、私が言及した部分図の簡易版である：
@model Trainings.Training
<div id="choose-students-by-class-dialog" title="select students" style="display:none">
@using (Html.BeginForm("SetStudentsForClass", FormMethod.Post, new { id = "chooseStudentsByClassesForm", Area = "TimeTracking" }))
{
@Html.HiddenFor(m => m.TrainingId)
<div class='cpCheckBoxes'>
@for (int i = 0; i < Model.ClassWithAssignedStudents.Count; i++)
{
@Html.HiddenFor(m => Model.ClassWithAssignedStudents[ i ].Id)
string className = Model.ClassWithAssignedStudents[ i ].Code + " (" + Model.ClassWithAssignedStudents[ i ].Name + ")";
<div class="cpEngagement">
<div class='cpExpandCollapseIcons'></div>
@if (Model.ClassWithAssignedStudents[ i ].AssignedStudents.All(u => u.IsAssigned))
{
@Html.CheckBox(Model.ClassWithAssignedStudents[ i ].Code, new { @class = "classCheckboxes", @checked = "checked" })
}
else
{
@Html.CheckBox(Model.ClassWithAssignedStudents[ i ].Code, new { @class = "classCheckboxes" })
}
<div class="cpClassName">@className</div>
<div class="cpInnerCheckBoxes cpInnerCheckBoxesHidden">
@for (int j = 0; j < Model.ClassWithAssignedStudents[ i ].AssignedStudents.Count; j++)
{
<div class="cpStudent">
@Html.HiddenFor(m => m.ClassWithAssignedStudents[ i ].AssignedStudents[ j ].UserId)
@Html.CheckBoxFor(m => m.ClassWithAssignedStudents[ i ].AssignedStudents[ j ].IsAssigned)
<span class="cpStudentFullname">
@Model.ClassWithAssignedStudents[ i ].AssignedStudents[ j ].UserFullName
</span>
</div>
}
</div>
</div>
}
</div>
}
</div>