2016-09-22 155 views
-1

我想要获取数据并将其显示在表格上,然后修改“可用性”并再次通过形成一个对象数组将其发布到服务器。现在我正在这样做,我能够获取数据,但它不会与修改。如何从表中读取数据并形成数组并将其发布?

<!DOCTYPE html> 
<html> 

    <head> 
    <link rel="stylesheet" href="style.css"> 
    <script src="script.js"></script> 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script> 
    </head> 


    <body ng-app="valueExample" ng-controller="ExampleController"> 
     <script> 
    angular.module('valueExample', []) 
    .controller('ExampleController', ['$scope', function($scope) { 
     $scope.routeDetails = 
     [ 
     { 
      "Employee":"Employee 1", 
      "date":"2016-09-25", 
      "availablity":"Yes" 
     }, 
     { 
      "Employee":"Employee 2", 
      "date":"2016-09-25", 
      "availablity":"No" 
     }, 
     { 
      "Employee":"Employee 3", 
      "date":"2016-09-25", 
      "availablity":"Yes" 
     }, 
     { 
      "Employee":"Employee 4", 
      "date":"2016-09-25", 
      "availablity":"No" 
     } 
     ] 
    $scope.submit = function(data) { 
     console.log(data); 
    }; 
    }]); 
</script> 
      <form> 
       <table class="table_role" > 
         <thead> 
          <tr><th>Employee Name</th> 
           <!-- <th>Date</th> --> 
           <th>Availablity</th> 
          </tr> 
         </thead> 
         <tbody ng-repeat="routeDetail in routeDetails | orderBy"> 
         <tr> 
          <td>{{routeDetail.Employee}}</td> 

          <!-- <td>{{routeDetail.date}}</td> --> 

          <td> 
           <input type="checkbox" ng-checked="routeDetail.availablity == 'Yes'" /> 
          </td> 
         </tr> 
         </tbody> 
        </table>  
       <button ng-click="submit(routeDetails)" type="submit">Submit</button> 
      </form> 
    </body> 


</html> 
+0

这里是一个plunker:https://plnkr.co/edit/7n1ugKHZWXROP9jtDgd4?p=preview –

回答

0

更改复选框逻辑是这样

<td> 
    <input type="checkbox" ng-model="routeDetail.availablity" 
        ng-true-value="'Yes'" ng-false-value="'No'"/> 
</td> 

它应该工作。

+0

谢谢你的反馈,它工作正常 –

+0

@AnujMayank欢迎 – Vikash

0

你需要一个函数来发布,你最好在服务中创建它。确保注入$ HTTP

function postman(url, data) { 
     var res = $http.post(url, data); 
     res.success(function (data, status, headers, config) { 
      console.log('success'); 
     }); 
     res.error(function (data, status, headers, config) { 
      alert("failure message: " + JSON.stringify({data: data})); 
     }); 
     return res; 
    } 

而在你的控制器,你可以这样调用:

Service.postman('your-url', {data: $scope.routeDetails}).then(function (results) { 
    console.log(results); 
}) 
相关问题