2015-08-20 1 views
0

Ceci est l'application de gestion de flotte dans mvc EF et knock-out, il y a des véhicules, des pilotes et des routes spécifiques que les conducteurs voyagent.Passer le modèle de vue knockout imbriquée au contrôleur

J'ai une situation où je voudrais recueillir des valeurs de champ de trois modèles imbriqués dans mes modèles de vue dans un seul objet et le poster mon backend via ajax. Je veux que cela soit déclenché en cliquant sur un bouton.

Il y a un problème dans ma fonction populateFleetInformation. Lorsque je rassemble les valeurs de champs de mes différents modèles, certaines des observables perdent leurs valeurs et apparaissent comme nulles.

Le modèle de vue qui tente de faire l'appel ajax

function FleetViewModel() { 
    var vvm = this; 
    vvm.regNumber = ko.observable(0); 
    vvm.make = ko.observable(""); 
    vvm.model = ko.observable(""); 
    vvm.RouteDetail = new RouteViewModel(); 
    vvm.SaveFleetInfo = function(item){ 
     if (!pageViewModel.isAuthenticated()) return; 
     populateFleetInformation(item); 
     $.when(postSecureData("/api/Fleet/", ko.toJSON(pageViewModel.FleetViewModel.RouteViewModel.RouteDriverViewModel))) 
      .done(function() { 
       document.getElementById("save-Fleet-btn").innerHTML = "Saving..."; 
       setTimeout(function() { document.getElementById("save-fleet-btn").innerHTML = "Save" }, 2500); 
       $.msgGrowl({ 
        type: 'info', 
        title: 'Fleet Information', 
        text: 'fleet information succesfully saved', 
        position: 'bottom-right', 
        lifetime: 3000 
       }); 

      }) 

    } 

} 

fonction qui recueille des données

function PopulateFleetInformation(item) 
{ 
    pageViewModel.fleetVM.regNumber(item.regNumber); 
    pageViewModel.fleetVM.make(item.make); 
    pageViewModel.fleetVM.model.(item.model); 
    pageViewModel.fleetVM.routeDetail.routeID(item.routeId); 
    pageViewModel.fleetVM.routeDetail.routeName(item.routeName); 
    pageViewModel.fleetVM.routeDriver.nationalId(item.nationalId); 
    pageViewModel.fleetVM.individualMsisdn.licenseId(item.licenseId); 
    pageViewModel.fleetVM.individualMsisdn.driverName(item.driverName); 

} 

Le bouton de déclenchement

<button type="submit" id="save-fleet-btn" class="btn"data-bind="click: $root.fleetVM.sensorDetail.SaveFleetInfo"></button> 
+0

Où sont vous attendez 'item' dans' PopulateFleetInformation' à venir, l'interface utilisateur ou à partir du résultat de l'appel ajax? –

+0

@Anish Patel de l'interface utilisateur, puis je veux passer ces valeurs (élément) au contrôleur, c'est pourquoi la méthode populate est avant la méthode de poste – anchor

+1

Où est l'appel ajax, est-ce 'postSecureData'? Que retourne l'appel ajax? –

Répondre

1

Cette fonction:

function PopulateFleetInformation(item) 
{ 
    pageViewModel.fleetVM.regNumber(item.regNumber); 
    pageViewModel.fleetVM.make(item.make); 
    pageViewModel.fleetVM.model.(item.model); 
    pageViewModel.fleetVM.routeDetail.routeID(item.routeId); 
    pageViewModel.fleetVM.routeDetail.routeName(item.routeName); 
    pageViewModel.fleetVM.routeDriver.nationalId(item.nationalId); 
    pageViewModel.fleetVM.individualMsisdn.licenseId(item.licenseId); 
    pageViewModel.fleetVM.individualMsisdn.driverName(item.driverName); 

} 

est pas faire ce que vous pensez qu'il est du tout.

item provient du contexte passé en SaveFleetInfo par knock-out lorsque vous cliquez sur votre bouton. Cette fonction définit ensuite les valeurs des champs que vous essayez de récupérer à item; Je devine que vous obtenez toutes sortes d'exceptions undefined ici.

Ce que vous voulez faire est la suivante:

function PopulateFleetInformation() 
{ 
    return { 
     regNumber: pageViewModel.fleetVM.regNumber(); 
     make: pageViewModel.fleetVM.make(); 
     model: pageViewModel.fleetVM.model.(); 
     routeId: pageViewModel.fleetVM.routeDetail.routeID(); 
     routeName: pageViewModel.fleetVM.routeDetail.routeName(); 
     nationalId: pageViewModel.fleetVM.routeDriver.nationalId(); 
     licenseId: pageViewModel.fleetVM.individualMsisdn.licenseId(); 
     driverName: pageViewModel.fleetVM.individualMsisdn.driverName(); 
    } 
} 

Cette fonction retourne les valeurs que vous êtes après comme un objet, vous pouvez poster ces données comme ceci:

var data = populateFleetInformation(); 
    $.when(postSecureData("/api/Fleet/", ko.toJSON(data)))