0

入力フィールドから別の非表示の入力フィールド (同じページの別のフォーム) に AngularJS を使用して入力値を取得しようとしているので、ユーザーが他のフォームで送信を押した場合に後で送信できます。

<div ng-app="">

    <p>Name: <input type="text" ng-model="name"></p>
//down the code...
    <form name="whatever" method="post">
        <input type="hidden" ng-bind="name" value="">
    </form>

</div>

可視入力フィールドにデータを入れた後にコードを調べると、すべて問題ないように見えるので、可視入力内のデータを変更すると、非表示の入力でもそれを見ることができますが、後で POST 変数では見ることができませんフォームを送信します - と の間の隠し入力の値フィールドを変更しないためだと思います。

非表示の入力のを変更するようにこれを機能させるにはどうすればよいですか?

4

2 に答える 2

1

次のように ng-bind を ng-value に置き換えるだけです。

<input type="hidden" ng-value="name">

(ヒメット・アヴサーの功績)

于 2015-01-18T16:07:04.377 に答える
1

あなたはすでに自分自身に答えているようです。とにかく、フォームを処理するときは、角度のある方法で「投稿」を行う必要があります。例えば:

HTML テンプレート

<body ng-controller="MainCtrl">
  <form name="form1" 
        ng-submit="submit()">
    Name: <input type="text" 
                 class="form-control" 
                 name="name" 
                 ng-model="user.name" 
                 required>
    <div class="alert alert-warning" 
         ng-show="form1.name.$error.required">
         Required field
    </div>
    <input type="submit" 
           class="btn btn-primary" 
           value="submit">
  </form>
  <div class="alert"  
       ng-class="{ 'alert-success': response.status === 200, 'alert-danger': response.status !== 200 }"
       ng-show="response !== null">
    DATA: {{ response.data }}<br>
    HTTP {{ response.status }} {{ response.statusText }} 
  </div>
  <hr>
  <form name="form2" ng-submit="submit()">
    Name: <input type="text" 
                 class="form-control" 
                 ng-model="user.name">
    Age: <input type="number" 
                class="form-control" 
                min="1" 
                max="100" 
                ng-model="user.age">
    <input type="submit" 
           class="btn btn-primary" 
           value="submit" disabled>
  </form>
</body>

JavaScript

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope, $http) {
  $scope.user = {};
  $scope.response = null;

  $scope.submit = function() {
    $scope.response = null;

    $http({
      method: 'POST',
      url: 'http://jsonplaceholder.typifcode.com/posts',
      data: $scope.user,
      headers: {'Content-Type': 'application/x-www-form-urlencoded'}
    }).then(function (response) {
      $scope.response = response;
    }).catch(function (response) {
      $scope.response = response;
    });
  };
});

次のようなものが得られます

イムグル

関連プランカーはこちらhttp://plnkr.co/edit/M7zQzp

于 2015-01-18T16:57:14.763 に答える