繁体   English   中英

POST方法未发送所有数据

[英]POST Method is not Sending All Data

我正在一个有趣的小项目中使用angular,node,express和postgresql / sequelize。 但是,它变得有点太有趣了。 我是在这种环境下开发的新手,因此我可能使用的结构不正确。 但是,我正在尝试为模型设置更新路径。 用于更新的JS看起来不错,正如它应该做的那样,但是这里的问题是,当调用函数并启动post方法时,它无法从html中的表单组中获取值。

这是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>

当我对此进行网络分析时,它发送JSON数据,但未指定值-但是,从响应中,我进入控制台日志,我认为它仅发送当前日期,因为更新的唯一属性是updateTime。

这是我认为有效的JS:

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

并在控制器中:

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

这是控制台中的结果:

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}}”“,依此类推。

更新!

您在提交时传递了一个空集,请检查您的updateform变量

您需要将ng-models添加到以updateform开头的输入中

 <input class="form-control" ng-model="updateform.field1" type="number" name="field1" ng-init="updateform.field3 =something.field3">

等等。 既然您说您正在使用$scope.somethingField ,请在标记中使用它,然后我还为id添加了一个隐藏字段。

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

然后在您的控制器中,函数$ scope.updateSomething之外:

$scope.updateform = {
    field1: '',
    field2: '',
    field3: ''
}

然后,在更新增加参数字段你控制器功能,尝试检查控制台日志如果field中包含的数据:

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

这是一个工作的JSfiddle

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM