I am working with angular, node, express, and postgresql/sequelize in a fun little project. However, it has gotten a little too fun. I am new to developing in this environment, so I may be using some incorrect structures. But, I am trying to set up an update route for a model. The JS for the update is seemingly good, as it does as it should, but the problem here is that when the function is called and the post method is initiated, it does not grab the values from the form group, in html.
Here is a snippet of the html/angular:
<div class="container">
<div ng-controller="SomethingCtrl">
<form ng-submit="updateSomething(updateform)" role="form" ng-init="updateform = {}">
<div class="datagrid"><table>
<thead>
<tr>
<th> ID </th>
<th> field1 </th>
<th> field2 </th>
<th> field3 </th>
</tr>
</thead>
<tbody>
<tr ng-repeat="something in somethings | filter:{id:somethingId} | orderBy:'id' | limitTo: 1 track by $index">
<td>
{{something.id}}
</td>
<td>
<div class="form-group">
<input class="form-control" type="text" name="field1" value="{{something.field1}}"/>
</div>
</td>
<td>
<div class="form-group">
<input class="form-control" type="text" name="field2" value="{{something.field2}}">
</div>
</td>
<td>
<div class="form-group">
<input class="form-control" type="number" name="field3" value="{{something.field3}}">
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div>
<button type="submit"><strong>Update</strong></button>
</div>
</form>
</div>
</div>
When I go into network analysis of this, it sends JSON data, but it does not specify the value -- but, from the response I get in console log I think it only sends current date as the only attribute that is updated is updateTime.
Here is the JS, which I think works:
exports.UpdateSomethings = function (req, res) {
models.Something.find({
where: {
id: req.params.id
}
}).then(function (something) {
if (something) { // if the record exists in the db
something.updateAttributes({
field1: req.body.field1,
field2: req.body.field2,
field3: req.body.field3
}).then(function (somethings) {
res.json(somethings.dataValues);
}).catch(function (error) {
console.log("ops: " + error);
res.status(500).json({ error: 'error' });
});
}
;
});
};
And in the Controller:
$scope.updateSomething = function () {
$http.post('/somethingupdate/:id', {
field1: $scope.somethingField1,
field2: $scope.somethingField2,
field3: $scope.somethingField3,
}).success(function (data, status, headers, config) {
$scope.somethings.push({
field1: $scope.somethingField1,
field2: $scope.somethingField2,
field3: $scope.somethingField3,
});
$scope.somethingField1 = '';
$scope.somethingField2 = '';
$scope.somethingField3 = '';
}).error(function (data, status, headers, config) {
console.log("Ops: " + data);
});
};
Here is the result in console:
Executing (default): SELECT "id", "field", "createdAt", "updatedAt" FROM "Soemthings" AS "Something" WHERE "Something"."id" = 'id value';
Executing (default): UPDATE "Somethings" SET "field1"='' "field2" = '' "field3" = '' "updatedAt"='2016-06-09 20:20:57.384 +00:00' WHERE "id" = id value
尝试使用ng-model =“ something.field1”代替value =“ {{something.field1}}”“,依此类推。
UPDATED!
You are passing an empty set when submit, check your updateform variable
You need to add ng-models to your inputs that starts with updateform
<input class="form-control" ng-model="updateform.field1" type="number" name="field1" ng-init="updateform.field3 =something.field3">
And so on. Since you said you are using $scope.somethingField
lets use it in your markup, then i added a hidden field for id
as well.
<div class="container">
<div ng-controller="SomethingCtrl">
<form ng-submit="updateSomething(updateform)" role="form">
<div class="datagrid"><table>
<thead>
<tr>
<th> ID </th>
<th> field1 </th>
<th> field2 </th>
<th> field3 </th>
</tr>
</thead>
<tbody>
<tr ng-repeat="something in somethings | filter:{id:1} | orderBy:'id' | limitTo: 1 track by $index">
<td>
<input type="hidden" ng-model="updateform.id" ng-init="updateform.id = something.id">
{{something.id}}
</td>
<td>
<div class="form-group">
<input class="form-control" ng-model="updateform.field1" type="text" ng-init="updateform.field1 = something.field1" />
</div>
</td>
<td>
<div class="form-group">
<input class="form-control" ng-model="updateform.field2" type="text" ng-init="updateform.field2 = something.field2" />
</div>
</td>
<td>
<div class="form-group">
<input class="form-control" ng-model="updateform.field3" type="text" ng-init="updateform.field3 =something.field3" />
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div>
<button type="submit"><strong>Update</strong></button>
</div>
</form>
Then in your controller outside the function $scope.updateSomething:
$scope.updateform = {
field1: '',
field2: '',
field3: ''
}
Then in you controller function for update add parameter field, try to check console logs if field
contains data:
$scope.updateSomething = function (field) {
console.log(field);
$http.post('/somethingupdate/' + field.id, {
field: field,
}).success(function (data, status, headers, config) {
$scope.somethings.push({
field: field
});
}).error(function (data, status, headers, config) {
console.log("Ops: " + data);
});
};
Here is a working JSfiddle
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.