输入字段值没有传递给控制器

我一直困在这一段时间。我有一个具有多个ChangeOrders和Purchase Orders的Job类。我可以创建一个没有问题的新工作。我使用相同的代码来发布新的CO和PO。问题是这些值没有绑定到控制器。新作业和CO/PO之间的区别在于我使用$ rootScope和ngStorage将JobId插入到CO/PO模式中。输入字段值没有传递给控制器

采购订单莫代尔

//New PurchaseOrder Modal 
$scope.NewPurchaseOrderModal = function() { 
    var modalInstance = $modal.open({ 
     templateUrl: 'views/modals/NewPurchaseOrderModal.html', 
     controller: 'NewPurchaseOrderModalInstanceCtrl', 
     windowClass: 'large-Modal', 
     resolve: { 
      p: function() { 
       return $scope.p; 
      } 
     } 
    }); 
};

采购订单POST

//Post New Purchase Orders 
$scope.submitPO = function() {; 
    $scope.job = {}; 
    alert($scope.PONumber); 
    var data = { 
     JobId: $scope.job.JobId, 
     PONumber: $scope.PONumber, 
     PODate: $scope.PODate, 
     POAmount: $scope.POAmount, 
     POLastPrintDate: $scope.POLastPrintDate, 
     POEmail: $scope.POEmail, 
     POPrint: $scope.POPrint, 
     POFaxNumber: $scope.POFaxNumber, 
     PONotes: $scope.PONotes, 
     POCreatedBy: $scope.POCreatedBy, 
     PODeliveryDate: $scope.PODeliveryDate, 
     POShipVia: $scope.POShipVia, 
     POShowPrices: $scope.POShowPrices, 
     POCostCode: $scope.POCostCode, 
     POApprovedNumber: $scope.POApprovedNumber, 
     POBackorder: $scope.POBackorder, 
     } 
    $http.post('/api/apiPurchaseOrder/PostNewPurchaseOrder', data).success(function (data, status, headers) { 
     console.log(data); 
     $scope.cancelNewPurchaseOrderModal(); 

    }); 
    }; 
});

采购订单查看

<div class="container" style="margin-top:20px" ng-controller="POCtrl"> 
    <form ng-submit="submitPO()" enctype="multipart/form-data"> 
    <fieldset> 
     <tabset> 
      <tab heading="Cover"> 
       <div class="col-xs-12" style="margin-top:10px"> 
        <div class="inline-fields" style="" ng-show="true"> 
         <label>JobId:</label> 
         <input style="width:150px;" ng-model="job.JobId" type="text" /> 
        </div> 
        <div class="inline-fields"> 
         <label></label> 
         <input style="width:150px;margin-left:81px" ng-model="job.JobName" type="text" /> 
         <label style="margin-left:268px">Number:</label> 
         <input style="width:150px" ng-model="PONumber" type="text" /> 
        </div> 
        <div class="inline-fields"> 
         <label style="margin-left:48px">Attn:</label> 
         <input style="width:150px;" ng-model="ChangeOrderAttn" type="text" /> 
         <label style="margin-left:291px">Date:</label> 
         <input style="width:150px" ng-model="PODate" type="date" /> 
        </div> 
        <div class="inline-fields"> 
         <label style="margin-left:39px">Email:</label> 
         <input style="width: 150px;" ng-model="POEmail" type="text" /> 
         <label style="margin-left:217px">GC Ref Number:</label> 
         <input style="width:150px" ng-model="POApprovedNumber" type="text" /> 
        </div> 
        <div class="inline-fields"> 
         <label style="margin-left:52px">Fax:</label> 
         <input style="width: 150px; " ng-model="POFaxNumber" type="text" /> 
         <label style="margin-left:233px">Delivery Date:</label> 
         <input style="width:150px" ng-model="PODeliveryDate" type="date" /> 
        </div> 
        <div class="inline-fields"> 
         <label style="margin-left: 438px">Approved Amount:</label> 
         <input style="width:150px" ng-model="ChangeOrderApprovedAmount" type="text" /> 
        </div> 
       </div><!--End col-xs-6--> 
       <div class="col-xs-12"> 
        <div class="inline-fields" style="margin-top:30px;margin-left:2px"> 
         <label>Created By:</label> 
         <input style="width:635px" ng-model="POCreatedBy" type="text" /> 
        </div> 
        <div class="inline-fields" style="margin-left:37px"> 
         <label>Notes:</label> 
         <textarea style="width:635px;height:200px" ng-model="PONotes"></textarea> 
        </div> 
        <div class="inline-fields" style="margin-top:10px;margin-left:509px"> 
         <label>Amount:</label> 
         <input style="width:150px" ng-model="POAmount" type="text" /> 
        </div> 
       </div> 
       <div class="col-xs-12" style="margin-top:30px;padding-bottom:20px"> 
        <input style="margin-left:435px;width:75px;margin-right:25px" ng-click="printEditChangeOrderModal()" type="button" value="Print" go-click="#" />&nbsp; 
        <input style="margin-right:25px;width:75px" type="submit" value="Save" go-click="#" /> 
        <input style="width:75px" type="button" ng-click="cancelNewPurchaseOrderModal();" value="Exit" go-click="#" /> 
       </div><!--End col-xs-12--> 
      </tab><!--End Cover Content--> 
      <tab heading="Details">...</tab> 
      <tab heading="Items">...</tab> 
     </tabset><!--End Tab Content--> 
    </fieldset><!--End Fieldset--> 
</form>

功能设置的JobId中的sessionStorage

//Sync Table Selections/sessionStorage 
$scope.selectedJob = $sessionStorage.$default($scope.jobArray[1]); 
$scope.selectJob = function (job) { 
    $rootScope.job = job; 
    angular.extend($scope.selectedJob, job); 
    console.log($rootScope.job); 
}; 
$scope.clearSelectedJob = function() { 
    $sessionStorage.$reset(); 
};

表来选择其工作是在Storage设置

<div id="scrollArea" style="margin-top:40px" ng-controller="JobCtrl"> 
        <table class=" table table-striped table-hover"> 
         <thead> <tr><th>No</th><th>Name</th></tr></thead> 
         <tbody> 
          <tr ng-repeat="job in jobArray" class="pointer no_selection" ng-class="{highlight: job.JobNumber===selectedJob.JobNumber}"> 
           <td ng-dblclick="EditJobModal(job.JobId)" ng-click="selectJob(job)">{{job.JobNumber}}</td> 
           <td ng-dblclick="EditJobModal(job.JobId)" ng-click="selectJob(job)">{{job.JobName}}</td> 
          </tr> 
         </tbody> 
        </table> 
       </div><!--End Job Table-->

PO控制器

'use strict'; 
app.controller('POCtrl', function ($scope, $rootScope, $resource, $http, $filter, 
    $q, $modal, PO, POGet, POFactory, notificationFactory) { 

//New PurchaseOrder Modal 
$scope.NewPurchaseOrderModal = function() { 
    var modalInstance = $modal.open({ 
     templateUrl: 'views/modals/NewPurchaseOrderModal.html', 
     controller: 'NewPurchaseOrderModalInstanceCtrl', 
     windowClass: 'large-Modal', 
     resolve: { 
      p: function() { 
       return $scope.p; 
      } 
     } 
    }); 
}; 
//Edit PurchaseOrder Modal 
$scope.EditPurchaseOrderModal = function (id) { 
    $.get('/api/apiPurchaseOrder/' + id, function (data) { 
     $scope.items = data; 
     var modalInstance = $modal.open({ 
      templateUrl: 'views/modals/EditPurchaseOrderModal.html', 
      controller: 'EditPurchaseOrderModalInstanceCtrl', 
      windowClass: 'large-Modal', 
      resolve: { 
       items: function() { 
        return $scope.items; 
       } 
      } 
     }); 
    }); 

}; 
//GET PurchaseOrders 
POGet.query().then(function (data) { 
    $scope.poArray = data; 
     }, function (reason) { 
      errorMngrSvc.handleError(reason); 
}); 


//Post New Purchase Orders 
$scope.submitPO = function() {; 
    $http.post('/api/apiPurchaseOrder/PostNewPurchaseOrder', $scope.data).success(function (data, status, headers) { 
     $scope.cancelNewPurchaseOrderModal(); 

    }); 
}; 
//$scope.submitPO = function() {; 
// $scope.job = {}; 
// alert($scope.PONumber); 
// var data = { 
//  JobId: $scope.job.JobId, 
//  PONumber: $scope.PONumber, 
//  PODate: $scope.PODate, 
//  POAmount: $scope.POAmount, 
//  POLastPrintDate: $scope.POLastPrintDate, 
//  POEmail: $scope.POEmail, 
//  POPrint: $scope.POPrint, 
//  POFaxNumber: $scope.POFaxNumber, 
//  PONotes: $scope.PONotes, 
//  POCreatedBy: $scope.POCreatedBy, 
//  PODeliveryDate: $scope.PODeliveryDate, 
//  POShipVia: $scope.POShipVia, 
//  POShowPrices: $scope.POShowPrices, 
//  POCostCode: $scope.POCostCode, 
//  POApprovedNumber: $scope.POApprovedNumber, 
//  POBackorder: $scope.POBackorder, 
//  } 
// $http.post('/api/apiPurchaseOrder/PostNewPurchaseOrder', data).success(function (data, status, headers) { 
//  console.log(data); 
//  $scope.cancelNewPurchaseOrderModal(); 

// }); 
//}; 
});//End POCtrl 
app.controller('NewPurchaseOrderModalInstanceCtrl', function ($scope, $modalInstance) { 

$scope.cancelNewPurchaseOrderModal = function() { 
    $modalInstance.dismiss('cancel'); 
}; 
}); 
app.controller('EditPurchaseOrderModalInstanceCtrl', function ($scope, $modalInstance, items) { 

$scope.items = items; 

$scope.cancelEditPurchaseOrderModal = function() { 
    $modalInstance.dismiss('cancel'); 
}; 
});

作业控制器

'use strict'; 
app.controller('JobCtrl', function ($scope, $rootScope, $resource, $route, $http, $filter, 
    $q, $modal, $sessionStorage, Job, JobGet, jobFactory, notificationFactory) { 


//New Job Modal 
$scope.NewJobModal = function() { 

    var modalInstance = $modal.open({ 
     templateUrl: 'views/modals/NewJobModal.html', 
     controller: 'NewJobModalInstanceCtrl', 
     windowClass: 'large-Modal', 
     resolve: { 
      p: function() { 
       return $scope.p; 
      } 
     } 
    }); 
}; 

$scope.EditJobModal = function (id) { 
    $.get('/api/apiJob/' + id, function (data) { 
     $scope.items = data; 
     var modalInstance = $modal.open({ 
      templateUrl: 'views/modals/EditJobModal.html', 
      controller: 'EditJobModalInstanceCtrl', 
      windowClass: 'large-Modal', 
      resolve: { 
       items: function() { 
        return $scope.items; 
       } 
      } 
     }); 
    }); 

}; 

//GET Jobs 

$scope.jobArray = {}; 
JobGet.query().then(function (data) { 
    $scope.jobArray = data; 
}, function (reason) { 
    errorMngrSvc.handleError(reason); 
}); 
//Post New Job 
$scope.submitJob = function() { 
    var data = { 
     GeoAreaId: $scope.newItems.GeoAreaId, 
     JobTypeId: $scope.newItems.JobTypeId, 
     JobClassId: $scope.newItems.JobClassId, 
     CustomerId: $scope.newItems.CustomerId, 
     JobId: $scope.newItems.JobId, 
     JobNumber: $scope.newItems.JobNumber, 
     JobName: $scope.newItems.JobName, 
     JobDescription: $scope.newItems.JobDescription, 
     JobOriginalContract: $scope.newItems.JobOriginalContract, 
     JobBillingDate: $scope.newItems.JobBillingDate, 
     JobTotalCO: $scope.newItems.JobTotalCO, 
     JobRevisedContract: $scope.newItems.JobRevisedContract, 



    } 
    $http.post('/api/apiJob/PostNewJob', data).success(function (data, status, headers) { 
     console.log(data); 
     $scope.cancelNewJobModal(); 
      $scope.$evalAsync(function() { 
       $scope.data; 
     }); 
    }); 
}; 

//Update Job 
$scope.updateJob = function (job) { 
    jobFactory.updateJob(job).success(successCallback) 
     .error(errorCallback); 
     console.log(job); 
      $scope.cancelEditJobModal(); 
       $scope.$evalAsync(function() { 
        $scope.job; 
       }); 
}; 
var successCallback = function (job, status, headers, config) { 
    notificationFactory.success(); 
}; 
var errorCallback = function (job, status, headers, config) { 
    notificationFactory.error(job.ExceptionMessage); 
}; 


//Sync Table Selections/sessionStorage 
$scope.selectedJob = $sessionStorage.$default($scope.jobArray[1]); 
$scope.selectJob = function (job) { 
    $rootScope.job = job; 
    angular.extend($scope.selectedJob, job); 
    console.log($rootScope.job); 
}; 
$scope.clearSelectedJob = function() { 
    $sessionStorage.$reset(); 
}; 

$scope.newItems = {}; 
//Typeahead New Job Customer select 

$scope.selectNewCustomer = function (customer) { 

    $scope.newItems.CustomerId = customer.CustomerId; 
    $scope.newItems.Customer.CustomerName = customer.CustomerName; 
    $scope.newItems.Customer.CustomerAddress = customer.CustomerAddress; 
    $scope.newItems.Customer.CustomerCity = customer.CustomerCity; 
    $scope.newItems.Customer.CustomerState = customer.CustomerState; 
    $scope.newItems.Customer.CustomerZipcode = customer.CustomerZipcode; 
    $scope.newItems.Customer.CustomerPhoneNumber = customer.CustomerPhoneNumber; 
    $scope.newItems.Customer.CustomerFaxNumber = customer.CustomerFaxNumber; 
    $scope.newItems.Customer.CustomerWebsite = customer.CustomerWebsite; 
    $scope.newItems.Customer.CustomerOtherShit = customer.CustomerOtherShit; 

    $scope.newItems.Customer.CustomerHidden = customer.CustomerHidden; 
    $scope.newItems.Customer.CustomerPM = customer.CustomerPM; 
    $scope.newItems.Customer.CustomerAdmin = customer.CustomerAdmin; 
    $scope.newItems.Customer.CustomerAccountant = customer.CustomerAccountant; 
}; 



});//End Job Controller 

app.controller('NewJobModalInstanceCtrl', function ($scope, $modalInstance) { 

$scope.cancelNewJobModal = function() { 
    $modalInstance.dismiss('cancel'); 
}; 
}); 
app.controller('EditJobModalInstanceCtrl', function ($scope, $modalInstance, items) { 

$scope.items = items; 

$scope.cancelEditJobModal = function() { 
    $modalInstance.dismiss('cancel'); 
}; 
});

来源

2014-10-09 texas697

我会改变单一模式来处理一切这更容易：

$scope.submitPO = function() { 
    $scope.data.jobId = $rootscope.job.id; //make sense? 
    $http.post('/api/apiPurchaseOrder/PostNewPurchaseOrder', $scope.data).success(function (data, status, headers) { 
     $scope.cancelNewPurchaseOrderModal(); 

    }); 
};

视图：

<div class="inline-fields" style="" ng-show="true"> 
    <label>JobId:</label> 
    <input style="width:150px;" ng-model="data.job.JobId" type="text" /> 
</div>

.....

<div class="inline-fields"> 
    <label style="margin-left:48px">Attn:</label> 
    <input style="width:150px;" ng-model="data.ChangeOrderAttn" type="text" /> 
    <label style="margin-left:291px">Date:</label> 
    <input style="width:150px" ng-model="data.PODate" type="date" /> 
</div>

和删除此$ scope.job = {};从您的提交功能，它看起来像'重置'作业到一个空的对象

来源

2014-10-09 17:00:16

问题在于作业正在sessionStorage中设置job.JobId而且我需要该JobId发布在每个CO ＆PO。我添加了更多的代码。感谢 – texas697 2014-10-09 17:26:11

只是绑定wharever job.id您从本地存储获得本地'$范围'，你可以张贴您的控制器也我想采取高峰 – 2014-10-09 17:42:57

张贴PO和作业控制器。不知道我明白我会绑定它的位置？ – texas697 2014-10-09 17:48:50

输入字段值没有传递给控制器​​

回答

相关问题

输入字段值没有传递给控制器