将嵌套的挖空视图模型传递给控制器​​

Question

这是mvc EF和淘汰赛中的车队管理应用程序，驾驶员可以使用车辆，驾驶员和特定路线。

我有一种情况，我希望将嵌套在我的视图模型中的三个模型的字段值收集到一个对象中，并通过ajax将其发布到后端。我希望通过单击按钮触发此操作。

我的populateFleetInformation功能存在问题。当我从各种模型中收集字段值时，一些可观察量正在丢失它们的值并显示为空。

尝试进行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
              });

          })

    }

}

收集数据的功能

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

}

触发按钮

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

Answer 1

此功能：

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

}

不按照您的想法行事。

item来自于点击按钮时被淘汰传递到SaveFleetInfo的上下文。然后，此函数将您尝试检索的字段的值设置为item中的任何值;我猜你在这里得到了各种undefined例外。

您想要做的是：

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

此函数返回您作为对象的值，然后您可以发布此数据：

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