私は送信したくないフォームの入力フィールドを持っています。入力欄で名前を削除したにもかかわらず、まだ魔法のために送信されています。Angularjs、フォーム送信時のデータの変更/削除
これを防ぐため、私はポストリクエストからこのアイテムを取り除くことができれば解決策になると考えました。
<input type='radio' ng-model='birthday' ng-value='true'>
フォーム送信時にPOSTには、名前属性を持たない入力にもかかわらずbirthdayというフィールドがあります。だから私はそれが表示されないようにします。
フォームは、私はあなたがdisabledプロパティを探していることができることを考えて、HTMLテンプレートで、コントローラは、NG-提出
に呼び出されます。
<input type='radio' ng-model='birthday' ng-value='true' disabled="true">
編集
送信時にフォームで不要な情報を送信しないためにdisabledプロパティを使用する方法の例を次に示します。
<html>
<body>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script>
var TestApp = angular.module("TestApp", []);
TestApp.controller('TestCtrl', function($scope) {
$scope.needsBirthdayDisabled = false;
$scope.needsBirthday = false;
$scope.sendForm = function(form) {
$scope.needsBirthdayDisabled = true; //if you comment this line, the "yep"'s input value will be sent with the form
form.$submitted = true;
};
});
</script>
<div ng-app="TestApp" ng-controller="TestCtrl">
<!-- the method is set to GET for test purpose (so we can easily see the sent values on the URL) -->
<form action="" method="GET" name="myForm" ng-submit="sendForm(this)">
<div>
<label for="name">Name</label>
<input type="text" name="name" ng-model="name"/>
</div>
<div ng-show="needsBirthday">
<label for="birthday">Birthday</label>
<input type="text" name="birthday" ng-model="birthday"/>
</div>
<div>
<label>Needs Birthday</label>
Yep <input type='radio' name="yep" ng-model='needsBirthday' ng-value='true' ng-disabled="needsBirthdayDisabled">
</div>
<input type="submit" value="Go!"/>
</form>
</div>
</body>
</html>
フォームの一部を表示したり非表示にしたり、バックエンドに必要なデータを含んでいないため、これを有効にしたいのでこれを使用することはできません。 –
フォームを送信する直前にこのプロパティを 'true'に設定した後、値を' false'に戻すことができます（有効範囲プロパティを使用することができます） – demarchisd
検証が実行された場合にはフォームの送信を防ぎますが、 –
これは問題ではありません。いくつかのコードを提供してください。そして何を試しましたか？このフォームをどうやって作りましたか？どのようにコントローラにリンクしましたか？あなたはAjaxでフォームをどのように送っていますか？ –
情報で更新されました –
もう一度コードを入力してください：データを送信する機能をイベントとして提供していない場合、どのように起こっているのでしょうか？データを送信する関数、送信されるデータ、送信元を追加します。通常、すべてのフォームデータに対して1つのオブジェクトがあり、それをリンクします。 'ng-model =" form.birthday "'コントローラでは、 '$ scope.form'オブジェクトをAjaxとともにバックエンドに送ることができます。 –