使用 Razor 局部视图动态添加到表单中的页面模型
Dynamically adding to page model in form using Razor partial view
我创建了一个 Razor 页面,允许用户在提交表单之前动态添加到对象模型,但是当我尝试转换为局部视图时,对象没有被添加到页面模型。只是移动到局部视图时,相同的代码不应该工作吗?
此代码有效:
<div class="row form-group">
<div>
<input type="submit" asp-page-handler="AddQuestion" class="btn btn-info" value="Add Question" />
</div>
<div class="form-group">
@for (var i = 0; i < Model.SurveyObject.Questions.Count; i++)
{
<h4><span class="alert-info">Question ID# @Model.SurveyObject.Questions[i].QuestionId</span></h4>
<span class="hidden">
@Html.LabelFor(x => Model.SurveyObject.Questions[i].QuestionId)
@Html.EditorFor(x => Model.SurveyObject.Questions[i].QuestionId)
</span>
@Html.LabelFor(x => Model.SurveyObject.Questions[i].Question)
@Html.EditorFor(x => Model.SurveyObject.Questions[i].Question)
}
</div>
</div>
但是当转换为局部视图时它不起作用:
<div class="row form-group">
<div>
<input type="submit" asp-page-handler="AddQuestion" class="btn btn-info" value="Add Question" />
</div>
<div class="form-group">
@for (var i = 0; i < Model.SurveyObject.Questions.Count; i++)
{
@await Html.PartialAsync("_SurveyCreateQuestion", Model.SurveyObject.Questions[i]);
}
</div>
</div>
这里是配套对象
public class Survey
{
public string SurveyName { get; set; }
public List<SurveyQuestion> Questions { get; set; }
public Survey()
{
this.SurveyName = "new survey name here";
this.Questions = new List<SurveyQuestion>();
}
}
public class SurveyQuestion
{
public int QuestionId { get; set; }
public string Question { get; set; }
public List<SurveyResponse> ResponseList { get; set; }
public SurveyQuestion() { }
public SurveyQuestion(int id)
{
this.QuestionId = id;
this.Question = "question text for id " + id;
this.ResponseList = new List<SurveyResponse>();
}
}
public class SurveyResponse
{
public int ResponseId { get; set; }
public string Response { get; set; }
public SurveyQuestion NextQuestion { get; set; }
public SurveyResponse() { }
public SurveyResponse(int id)
{
this.ResponseId = id;
this.Response = "response text for id " + id;
}
}
这是 cshml 文件。
public class SurveyCreateModel : PageModel
{
[BindProperty]
public Survey SurveyObject { get; set; }
public void OnGet()
{
}
public void OnPostAddQuestion()
{
this.SurveyObject.Questions.Add(new SurveyQuestion(this.SurveyObject.Questions.Count + 1));
}
}
和局部视图。
@model SurveyCreateModel.SurveyQuestion
@if (Model == null)
{
<span></span>
}
else
{
<h4><span class="alert-info">Question ID# @Model.QuestionId</span></h4>
<span class="hidden">
@Html.LabelFor(x => Model.QuestionId)
@Html.EditorFor(x => Model.QuestionId)
</span>
@Html.LabelFor(x => Model.Question)
@Html.EditorFor(x => Model.Question)
}
查看呈现的源代码 HTML 没有局部视图的循环正在按预期创建独特的元素,例如单击两次添加问题按钮时生成的这些标签。
<label for="SurveyObject_Questions_0__QuestionId">QuestionId</label>
<label for="SurveyObject_Questions_1__QuestionId">QuestionId</label>
但是当生成标签的相同代码被移动到同一循环内的局部视图中时,html 呈现如下:
<label for="QuestionId">QuestionId</label>
部分视图的屏幕打印不起作用 - 继续按添加问题但始终停留在第一个问题 - 模型未更新
代码运行的屏幕截图 - 按两次添加问题按钮并添加两个问题 - 模型正在更新
我无法让它与部分视图一起使用,但它在使用编辑器模板时确实有效。
@model SurveyCreateModel.SurveyQuestion
<h4><span class="alert-info">Question ID# @Model.QuestionId</span></h4>
<span class="hidden">
@Html.LabelFor(x => Model.QuestionId)
@Html.EditorFor(x => Model.QuestionId)
</span>
@Html.LabelFor(x => Model.Question)
@Html.EditorFor(x => Model.Question)
然后这段代码在cshtml中被this引用了:
<div class="form-group">
@Html.EditorFor(x => x.SurveyObject.Questions)
</div>
我创建了一个 Razor 页面,允许用户在提交表单之前动态添加到对象模型,但是当我尝试转换为局部视图时,对象没有被添加到页面模型。只是移动到局部视图时,相同的代码不应该工作吗?
此代码有效:
<div class="row form-group">
<div>
<input type="submit" asp-page-handler="AddQuestion" class="btn btn-info" value="Add Question" />
</div>
<div class="form-group">
@for (var i = 0; i < Model.SurveyObject.Questions.Count; i++)
{
<h4><span class="alert-info">Question ID# @Model.SurveyObject.Questions[i].QuestionId</span></h4>
<span class="hidden">
@Html.LabelFor(x => Model.SurveyObject.Questions[i].QuestionId)
@Html.EditorFor(x => Model.SurveyObject.Questions[i].QuestionId)
</span>
@Html.LabelFor(x => Model.SurveyObject.Questions[i].Question)
@Html.EditorFor(x => Model.SurveyObject.Questions[i].Question)
}
</div>
</div>
但是当转换为局部视图时它不起作用:
<div class="row form-group">
<div>
<input type="submit" asp-page-handler="AddQuestion" class="btn btn-info" value="Add Question" />
</div>
<div class="form-group">
@for (var i = 0; i < Model.SurveyObject.Questions.Count; i++)
{
@await Html.PartialAsync("_SurveyCreateQuestion", Model.SurveyObject.Questions[i]);
}
</div>
</div>
这里是配套对象
public class Survey
{
public string SurveyName { get; set; }
public List<SurveyQuestion> Questions { get; set; }
public Survey()
{
this.SurveyName = "new survey name here";
this.Questions = new List<SurveyQuestion>();
}
}
public class SurveyQuestion
{
public int QuestionId { get; set; }
public string Question { get; set; }
public List<SurveyResponse> ResponseList { get; set; }
public SurveyQuestion() { }
public SurveyQuestion(int id)
{
this.QuestionId = id;
this.Question = "question text for id " + id;
this.ResponseList = new List<SurveyResponse>();
}
}
public class SurveyResponse
{
public int ResponseId { get; set; }
public string Response { get; set; }
public SurveyQuestion NextQuestion { get; set; }
public SurveyResponse() { }
public SurveyResponse(int id)
{
this.ResponseId = id;
this.Response = "response text for id " + id;
}
}
这是 cshml 文件。
public class SurveyCreateModel : PageModel
{
[BindProperty]
public Survey SurveyObject { get; set; }
public void OnGet()
{
}
public void OnPostAddQuestion()
{
this.SurveyObject.Questions.Add(new SurveyQuestion(this.SurveyObject.Questions.Count + 1));
}
}
和局部视图。
@model SurveyCreateModel.SurveyQuestion
@if (Model == null)
{
<span></span>
}
else
{
<h4><span class="alert-info">Question ID# @Model.QuestionId</span></h4>
<span class="hidden">
@Html.LabelFor(x => Model.QuestionId)
@Html.EditorFor(x => Model.QuestionId)
</span>
@Html.LabelFor(x => Model.Question)
@Html.EditorFor(x => Model.Question)
}
查看呈现的源代码 HTML 没有局部视图的循环正在按预期创建独特的元素,例如单击两次添加问题按钮时生成的这些标签。
<label for="SurveyObject_Questions_0__QuestionId">QuestionId</label>
<label for="SurveyObject_Questions_1__QuestionId">QuestionId</label>
但是当生成标签的相同代码被移动到同一循环内的局部视图中时,html 呈现如下:
<label for="QuestionId">QuestionId</label>
部分视图的屏幕打印不起作用 - 继续按添加问题但始终停留在第一个问题 - 模型未更新
代码运行的屏幕截图 - 按两次添加问题按钮并添加两个问题 - 模型正在更新
我无法让它与部分视图一起使用,但它在使用编辑器模板时确实有效。
@model SurveyCreateModel.SurveyQuestion
<h4><span class="alert-info">Question ID# @Model.QuestionId</span></h4>
<span class="hidden">
@Html.LabelFor(x => Model.QuestionId)
@Html.EditorFor(x => Model.QuestionId)
</span>
@Html.LabelFor(x => Model.Question)
@Html.EditorFor(x => Model.Question)
然后这段代码在cshtml中被this引用了:
<div class="form-group">
@Html.EditorFor(x => x.SurveyObject.Questions)
</div>