2017-04-05 9 views
0

これは死んでいるように見えますが、私はまだコードを動作させることができません。MVCコントローラへのPOSTはKnockoutJSからNULLです

私はKnockoutjsの編集可能なテーブルを使用しようとしており、コントローラにAJAXポストを使用してモデルに追加しようとしています。ただし、ポストはコントローラ内で常にヌルです。ここで

は、モデルの:

using System.ComponentModel.DataAnnotations; 
using System.Data.Entity; 

namespace Adder_Web.Models 
{ 
    public class User 
    { 
     [Display(Name = "ID")] 
     [Required] 
     [StringLength(9, ErrorMessage = "SSO must be 9 numbers", MinimumLength = 9)] 
     public virtual string ID { get; set; } 

     [Display(Name = "First Name")] 
     [Required] 
     public string FirstName { get; set; } 

     [Display(Name = "Last Name")] 
     [Required] 
     public string LastName { get; set; } 

    } 

    public class UserContext : DbContext 
    { 
     public DbSet<User> Users { get; set; } 
    } 


} 

ここで私はに投稿しようとしてるのコントローラです。投稿されたときに、ユーザーがnullである:

script> 
    var UserModel = function (users) { 
     var self = this; 
     self.users = ko.observableArray(users); 

     self.addUser = function() { 
      self.users.push({ 
       id: "", 
       firstName: "", 
       lastName: "" 
      }); 
     }; 

     self.removeUser = function (user) { 
      self.users.remove(user); 
     }; 

     self.save = function (form) { 

      sendData = JSON.stringify(self.users); 

      $.ajax({ 
       url: '/Users/CreateMultiple', 
       contentType: "string", 
       async: true, 
       type: "POST", 
       data: JSON.stringify(sendData), 
       error: function (jqXHR, textStatus, errorThrown) { 
        console.log("FAIL: " + errorThrown); 
       }, 
       success: function (data, textStatus, jqXHR) { 
        console.log("SUCCES"); 
       } 
      }); 


     }; 
    }; 

    var viewModel = new UserModel([ 
     { id: "123456789", firstName: "John", lastName: "Doe" } 
    ]); 
    ko.applyBindings(viewModel); 

    // Activate jQuery Validation 
    $("form").validate({ submitHandler: viewModel.save }); 
</script> 

答えて

0

@rStackSharper

ただ、バックエンドで、フロントエンドのユーザーモデルが同じ性質を持っていること、それは確認してください。

例:

あなたのバックエンドで、あなたのフロントエンドに

class User 
{ 
    public string FirstName { get; set; } 
    public string LastName { get; set; } 
} 

は、

var user = { FirstName: "John", LastName: "Doe" }; 

またはあなたがそれに関数を作成する場合でなければなりません。

function user(){ 

    this.FirstName = "John"; 
    this.LastName = "Doe"; 
} 

その後、あなたはそれが

を受け入れられるようにするためにJSON.stringify(ユーザー)に持って、それをサーバに送信するとき
1

Javascriptのパート:

  • あなたが設定する必要があなたのsendData 2回
  • を文字列化

    [HttpPost] 
        public async Task<ActionResult> CreateMultiple(IEnumerable<User> users) 
        { 
         if (ModelState.IsValid) 
         { 
          foreach (User oneUser in users) 
    
          { 
           db.Users.Add(oneUser); 
           await db.SaveChangesAsync(); 
           return RedirectToAction("Index"); 
          } 
    
         } 
    
         return View(users); 
        } 
    

    そして、ここではjavascriptのです正しいコンテンツタイプ(application/json

C#Part:

コントローラでは、モデルがhttp投稿要求の本文から来ていることを自分のメソッドに通知する必要があります。

public async Task<IActionResult> CreateMultiple([FromBody] IEnumerable<User> users) 
{ 
    /*..*/ 
} 
0

はあなたがコンテンツタイプとstringfyを削除しようとすることができ、私はそれを動作ウィル願っていますし、あなたのAjaxメソッドが対象とポストされている場合は、[FromBody]属性を入れて持っていけません。この属性は、次のように使用できます。

[HttpPost] 
public async Task<IActionResult> CreateMultiple([FromBody] string userCode){ 

} 
[HttpGet] 
public async Task<IActionResult> CreateMultiple(string userCode){ 

} 
0

下記のようにajaxメソッドを変更すると役立つかもしれません。 、


注:({のsendDataユーザー:}):データにJSON.stringify(のsendData): - データ」でユーザーをデータ - :

または他の単純 元のようなAJAX方式のデータ属性を変更ありがとうございました:({ユーザー:のsendData})は」あなたのCreateMultiple(IEnumerableをユーザー)メソッドのパラメータ名です

$.ajax({ 
      url:'@Url.Content("~/Users/CreateMultiple")', 
      async: true, 
      cache:false,   
      type: 'POST', 
      data: ({users:sendData}), 
      error: function (jqXHR, textStatus, errorThrown) { 
       console.log("FAIL: " + errorThrown); 
      }, 
      success: function (data, textStatus, jqXHR) { 
       console.log("SUCCES"); 
      } 
     }); 
0

私はそれは次のように変更することによって並べ替えを取得することができました:

AJAX:

self.save = function (form) { 

     sendData = ko.toJSON(self.users); 


     $.ajax({ 
      url: '/Users/CreateMultiple', 
      contentType: 'application/json', 
      async: true, 
      type: 'POST', 
      dataType: 'json', 
      data: sendData, 
      error: function (jqXHR, textStatus, errorThrown) { 
       console.log("FAIL: " + errorThrown); 
      }, 
      success: function (data, textStatus, jqXHR) { 
       console.log("SUCCES"); 
      } 
     }); 


    }; 

CONTROLLER:

[HttpPost] 
    public ActionResult CreateMultiple(List<User> users) 
    { 
     if (ModelState.IsValid) 
     { 
      foreach (User oneUser in users) 
      { 
        db.Users.Add(oneUser); 
        db.SaveChanges(); 
      } 
      return RedirectToAction("Index"); 
     } 

     return View(); 
    } 
関連する問題