Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/403.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/4/json/15.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript AngularJS编辑数据/表格_Javascript_Json_Angularjs_Sql Update - Fatal编程技术网

Javascript AngularJS编辑数据/表格

Javascript AngularJS编辑数据/表格,javascript,json,angularjs,sql-update,Javascript,Json,Angularjs,Sql Update,我希望在AngularJS上生成一个表单,以编辑通过RESTAPI访问的数据库行。我访问数据没有问题,我真正的问题是配置表单进行编辑。如何显示数据?如果用户单击“提交”按钮,如何更新数据。下面是我的角度代码 countryApp.controller('EditLocation', function($scope, $http, $routeParams, $location) { //get the item information var id = $rout

我希望在AngularJS上生成一个表单,以编辑通过RESTAPI访问的数据库行。我访问数据没有问题,我真正的问题是配置表单进行编辑。如何显示数据?如果用户单击“提交”按钮,如何更新数据。下面是我的角度代码

   countryApp.controller('EditLocation', function($scope, $http, $routeParams, $location) { 
      //get the item information
      var id = $routeParams.locid; 
      $scope.activePath = null;    

      $http.get('http://localhost/slimtest2/location/'+id).success(function(data) { 
        $scope.location = data;  

      }); 

      $scope.editrel = function() { 
          var editData = { 
              location_title : $scope.l.location_title, 
              location_latitude : $scope.l.location_latitude, 
              location_longitude : $scope.l.location_longitude     
          } 

          //convert data to JSON string
          var loce = JSON.stringify(editData); 


          $http.put('http://localhost/slimtest2/location/edit', loce); 

      }

      $scope.reset = function() { 
        $scope.location = data; 
      } 


    }); 
HTML-编辑表单

<div ng-controller="EditLocation"> 

   <form name="editform" ng-submit="editrel()"> 
      <div ng-repeat="l in location.location">  
     <label for="location_title">Location Title</label>
     <input type="text" ng-model="l.location_title"> 
     <br/> 
      <label for="location_latitude">Location Latitude</label>
     <input type="text" ng-model="l.location_latitude"> 
     <br/> 
        <label for="location_longitude">Location Longitude</label>
     <input type="text" ng-model="l.location_longitude"> 
     <br/>  


      <input type="submit" value="Submit"> 
      <input type="button" ng-click="reset()" value="Reset"></input>
     </div> 
    </form>
</div>

地点名称

位置纬度
位置经度

如果您的
put
响应不包含新的位置数据,您可以通过执行以下操作来获取数据:

$http.put('http://localhost/slimtest2/location/edit', loce).success(function () {
  $http.get('http://localhost/slimtest2/location/'+id).success(function(data) { 
    $scope.location = data;  
  });
});

如果您的
put
响应不包含新的位置数据,您可以通过执行以下操作来获取数据:

$http.put('http://localhost/slimtest2/location/edit', loce).success(function () {
  $http.get('http://localhost/slimtest2/location/'+id).success(function(data) { 
    $scope.location = data;  
  });
});

你能分享你的HTML表单代码吗,只是为了确定ng模型是否正确?@Tomislav我刚刚添加了HTML表单代码。你可以检查@Exo-answer,只要在$http.put完成任务后再次调用$http.get即可。您的模型将刷新。@Tomislav刚刚修复,工作正常。:)你能分享你的HTML表单代码吗,只是为了确定ng模型是否正确?@Tomislav我刚刚添加了HTML表单代码。你可以检查@Exo-answer,只要在$http.put完成任务后再次调用$http.get即可。您的模型将刷新。@Tomislav刚刚修复,工作正常。:)