KnockoutJs & Asp.Net MVC 4 - vues multi-modèles Envoyer

Question

Je suis dans une situation où j'ai 2 onglets et pour chaque onglet j'ai une vue partielle, j'utilise jquery UI pour créer mes onglets.

J'ai deux options pour chaque utilisateur: 1. enregistrer, 2. soumettre.

Lors de l'enregistrement, il enregistre pour cet onglet (où l'onglet contient la vue du modèle 1) pour la deuxième même (où ce Tabe contient la vue du modèle 2)

Comment puis-je soumettre les deux modèles des deux onglets avec un clic?

J'ai quelque chose comme ça dans mon onglet pour enregistrer 1 et 2. onglet

Mon premier modèle de vue.

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

Ma seconde vue Modèle.

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

Answer 1

Suite à mon commentaire. Voici un violon pour la première approche.

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

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()); 

et le code HTML serait

<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> 

espoir qui aide.