如何使用Ajax更新這個div？

Question

這是我的剃鬚刀視圖。主要的一點是當我的下拉值發生變化時，更新question-editor div。正如你所看到的，我正在調用EditorFor。

@model Contoso.MvcApplication.Models.Question.CreateQuestionViewModel 

@{ 
    ViewBag.Title = "Create Open Question"; 
} 

<h3>Create Question</h3> 

<select id="question-type-dropdown" style="margin-bottom: 20px;"> 
    <option value="MC">Multiple Choice</option> 
    <option value="O">Open Question</option> 
</select> 

@using (Html.BeginForm()) { 
    @Html.ValidationSummary(true) 

    <fieldset> 
     @Html.HiddenFor(model => model.QuestionSetId) 
     <legend>Question Template</legend> 

     <div id="question-editor"> 
      @Html.EditorFor(model => model.Template, "_QuestionEditorBoxPartial") 
     </div> 

     <p> 
      <input type="submit" value="Save" /> 
     </p> 
    </fieldset> 
} 

這裏是局部視圖，只是包含一個EditorModelFor來選擇它應該使用哪個視圖模板。

_QuestionEditorBox（PartialView）

@model Contoso.Core.Base.QuestionTemplate 
@Html.EditorForModel(Contoso.Core.QuestionRepositoryManager.GetQuestionTemplateView(Model)) 
public abstract class Question 
{ 
    public int Id {get;set;} 
    public string QuestionText { get; set; } 
} 

public OpenQuestion : Question { ... } 
public MultipleChoiceQuestion : Question { ... } 

public class CreateQuestionViewModel 
{ 
    public int QuestionSetId { get; set; } 
    public QuestionTemplate Template { get; set; } 
} 

但我這樣做的時候，因爲我與同型號做EditorFor兩次不顯示任何內容。我試圖用PartialView更改第一個EditorFor，但這不會起作用，因爲我需要模型綁定器捕獲我的模型。

EDIT（AJAX方法）：

$("#question-type-dropdown").change(function() { 
    $.get("/Question/UpdateQuestionEditorBox", { questionType: $(this).val() }, 
     function (data) { 
      $("#question-editor").html(data); 
     }); 
}); 

Answer 1

一種可能性是使用部分（不是一個編輯模板）：

<div id="question-editor"> 
    @Html.Partial("_QuestionEditorBox.cshtml", Model.Template) 
</div> 

然後裏面的部分：

@model Contoso.Core.Base.QuestionTemplate 
@{ 
    ViewData.TemplateInfo.HtmlFieldPrefix = "Template"; 
} 
@Html.EditorForModel(Contoso.Core.QuestionRepositoryManager.GetQuestionTemplateView(Model)) 

請注意我是如何設置HtmlFieldPrefix以便p將導航上下文保留到部分中，併爲相應編輯器模板中的輸入字段生成專有名稱。

此外，您還提到當下拉選擇更改但您尚未顯示任何AJAX代碼來執行此操作時，將通過AJAX調用更新question-editor div。我猜你已經訂閱了某處下拉菜單的.change事件並觸發了AJAX調用。