KnockoutJs 및 Asp.Net MVC 4 - 다중 모델보기 제출

Question

나는 2 개의 탭이 있으며 각 탭마다 부분 뷰가 있으며 jquery UI를 사용하여 탭을 만듭니다.

나는 각 사용자를 위해 두 가지 옵션을 가지고 있습니다. 1. 저장하려면, 2. 제출하려면.

는 내가 함께 두 탭에서 두 모델을 제출할 수있는 방법

(이 타베이 모델 뷰 2를 포함) 동일 초 (탭이 모델 뷰 1을 포함) 특정 탭의 저장됩니다 저장에

한 번의 클릭?

나는이 같은 뭔가를 내 탭 1과 탭 2

내 첫 번째보기 모델에 저장합니다.

 self.save = function() { 
      $.ajax({ 
       url: "MyTabs", 
       data: { data: ko.toJSON(self.firstVM) }, 
       type: "post", 
       contentType: "application/json", 
       success: function(result) { alert(result); } 
      }); 
     }; 

내 두 번째보기 모델.

  self.save = function() { 
      $.ajax({ 
       url: "MyTabs", 
       data: { data: ko.toJSON(self.secondVM) }, 
       type: "post", 
       contentType: "application/json", 
       success: function(result) { alert(result); } 
      }); 
     }; 

Answer 1

내 의견에 대한 후속 조치. 첫 번째 접근법을위한 바이올린입니다.

var child1ViewModel = function(){ 
    var x = ko.observable(1), 
      y = ko.observable('child1'), 
     getData = function(){ 
      return JSON.stringify({x: x(), y: y()}); 
      }, 
     save= function(){ 

      alert(getData()); 
      //some ajax call 
     }; 


    return { 
     x: x, 
     y: y, 
     save: save, 
     getData: getData 
    } 
}; 

var child2ViewModel = function(){ 
    var x = ko.observable(2), 
     y = ko.observable('child2'), 
     getData = function(){ 
      return JSON.stringify({x: x(), y: y()}); 
     }, 
     save= function(){ 

      alert(getData()); 
      //some ajax call 
     }; 

    return { 
     x: x, 
     y: y, 
     save: save, 
     getData: getData 
    } 
}; 

var parentViewModel = function(){ 
    var child1 = new child1ViewModel(), 
     child2 = new child2ViewModel(), 
     submit = function(){ 
      var data = { 
       child1Data: child1.getData(), 
       child2Data : child2.getData() 
      }; 
      alert(JSON.stringify(data)); 
      //make ajax submit 
     }; 

    return { 
     child1: child1, 
     child2: child2, 
      submit: submit 
    } 
} 

ko.applyBindings(new parentViewModel()); 

http://jsfiddle.net/sujesharukil/FDPAn/

와 HTML 도움

<form data-bind="submit: submit"> 
    <h1>Data from CHild 1</h1> 
    x = <input data-bind="value: child1.x"/><br/> 
    y = <input data-bind="value: child1.y"/><br/> 
    <button type="button" data-bind="click: child1.save">Save Child1</button> 
    <h1>Data from CHild 2</h1> 
    x = <input data-bind="value: child2.x"/><br/> 
    y = <input data-bind="value: child2.y"/><br/> 
    <button type="button" data-bind="click: child2.save">Save Child2</button><br/> 
    <button type="submit">Submit</button> 
</form> 

희망이 될 것입니다.