knockout dropdownlist databind가 ajax 호출에서 작동하지 않습니다.

Question

MVC 4의 녹아웃에서 드롭 다운 목록을 바인딩하려고합니다. 아래 코드를 참조하십시오.

액션

public JsonResult GetUserTypes() 
    { 
     using (QuestApplicationEntities db = new QuestApplicationEntities()) 
     { 
      var usertypes = (from usertype in db.UserTypes 
          select new 
          { 
           usertype.Id, 
           usertype.Name 
          }).ToArray(); 

      return Json(usertypes, JsonRequestBehavior.AllowGet); 
     } 
    } 

Knockout.js

var Register = 
{ 
    Name: ko.observable("Ragesh"), 
    Email: ko.observable().extend({ email: true }), 
    Password: ko.observable(), 
    UserTypes: ko.observableArray([]), 

    UserType: ko.observable(), 

    SaveRegistration: function() { 
     //alert('saved'); 
     $.ajax({ 
      url: '/Home/RegisterUser', 
      type: 'post', 
      datatype: 'json', 
      data: ko.toJSON(this), 
      contentType: 'application/json', 
      success: function() { 
       alert('saved'); 
      } 
     }); 
    } 
}; 

$.ajax({ 
      url: '/Home/GetUserTypes', 
      type: 'post', 
      datatype: 'json', 
      data: ko.toJSON(this), 
      contentType: 'application/json', 
      success: function() { 
       ko.mapping.fromJS(data,Register.UserTypes); 
     } 
    }); 

    ko.applyBindings(Register); 

HTML을

<h4>Register</h4> 
<fieldset> 
<legend>New User Registration</legend> 
<div class="editor-label"> 
    Name 
</div> 
<div class="editor-field"> 
    <input data-bind="value:Name" /> 
</div> 
<div class="editor-label"> 
    Email 
</div> 
<div class="editor-field"> 
    <input data-bind="value:Email" /> 
</div> 
<div class="editor-label"> 
    User Type 
</div> 
<div class="editor-field"> 
    <select data-bind="options: UserTypes, value: UserType, optionsCaption: 'Select User Type...'"> 
    </select> 
</div> 
<p> 
    <button type="button" data-bind="click:SaveRegistration">Register</button> 
</p> 
</fieldset> 
<script src="~/Scripts/knockout-2.2.1.js"></script> 
<script src="~/Scripts/knockout.validation.js"></script> 
<script src="~/Scripts/App/Register.js"></script> 

그러나 GetUserTypes 액션 해고되지 않았습니다.

방화범에 다른 오류가 표시됩니다.

이 도와주세요.

Answer 1

GetUserTypes이 매개 변수 예상되지 않습니다 행동에 데이터 매개 변수를 추가,하지만 당신은 뷰 모델 객체를 전달합니다 아약스 호출에서이 속성을 제거 할 수

.... 
$.ajax({ 
    url: '/Home/GetUserTypes', 
    type: 'post', 
    datatype: 'json', 
    data: ko.toJSON(this), 
    ... 

시도합니다.

FireBug에서 오류가 발생하면 페이지에 jQuery 스크립트가 포함됩니다.

Answer 2

목록이 데이터 변수에 포함되지 않는다고 생각합니다. 따라서 데이터 변수는 null이어야합니다.

시도해보십시오. 성공 기능

$.ajax({ 
     url: '/Home/GetUserTypes', 
     type: 'post', 
     datatype: 'json', 
     data: ko.toJSON(this), 
     contentType: 'application/json', 
     success: function (data) { 
      ko.mapping.fromJS(data,Register.UserTypes); 
    } 
});