web-dev-qa-db-ja.com

入力値を変更してからJavaScriptでフォームを送信する

私は現在、基本的なフォームに取り組んでいます。このフォームでやりたいことは、送信/ボタンを押して最初にフィールドの値を変更してから、通常どおりフォームを送信することです。すべて次のようになります。

<form name="myform" id="myform" action="action.php">
<input type="hidden" name="myinput" value="0" />
<input type="text" name="message" value="" />
<input type="submit" name="submit" onclick="DoSubmit()" />
</form>

そして、これが私がJavaScriptをどの程度使用したかです。 「myinput」の値を1に変更しますが、フォームを送信しません。私は本当にJavaScriptの初心者なので、これがあまりにも単純な質問である場合はご容赦ください。

function DoSubmit(){
  document.myform.myinput.value = '1';
  document.getElementById("myform").submit();
}
javascripthtmlformsonclicksubmit
42
Paparappa

代わりに次のようなことができます：

<form name="myform" action="action.php" onsubmit="DoSubmit();">
<input type="hidden" name="myinput" value="0" />
<input type="text" name="message" value="" />
<input type="submit" name="submit" />
</form>

次に、DoSubmit関数を変更して、trueを返すだけで、「OK、今すぐフォームを送信できる」ことをブラウザに示します。

function DoSubmit(){
  document.myform.myinput.value = '1';
  return true;
}

編集：送信ボタンでonclickイベントを使用することにも注意してください。イベントの順序はすぐにはわからないため、ユーザーがテキストボックスでReturnキーを押すなどして送信した場合、コールバックは呼び出されません。

57
valderman
document.getElementById("myform").submit();

フォームタグにはIDがないため、これは機能しません。

このように変更すると、動作するはずです：

<form name="myform" id="myform" action="action.php">
6
Claude Schlesser

いいえ。入力タイプが送信の場合、マークアップでonsubmitイベントを宣言し、必要な変更を行う必要があります。つまり、フォームタグでonsubmitを定義します。

そうでない場合は、入力タイプをボタンに変更してから、そのボタンのonclickイベントを定義します。

5
Ashwin Krishnamurthy

ここに簡単なコードがあります、ここで入力するためのidを設定する必要があります 'myInput'を呼び出します：

      var myform = document.getElementById('myform');
      myform.onsubmit = function(){ 
                    document.getElementById('myInput').value = '1';
                    myform.submit();
                  };
5
Said Marar

サーバーへのポストバックで機能するname属性に基づいて要素にアクセスしようとしていますが、javascriptはid属性に応答します。 idと同じ値を持つnameを追加すると、すべて正常に機能するはずです。

<form name="myform" id="myform" action="action.php">
  <input type="hidden" name="myinput" id="myinput" value="0" />
  <input type="text" name="message" id="message" value="" />
  <input type="submit" name="submit" id="submit" onclick="DoSubmit()" />
</form>

function DoSubmit(){
  document.getElementById("myinput").value = '1';
  return true;
}
2
Chris Snowden

私の問題は、document.getElementById("myinput").Value = '1';として割り当てていたことでした。

Valueの資本Vに注目してください。一度小さなケースに変更したら、値、データが投稿を開始しました。奇妙なことに、JavaScriptエラーも発生していませんでした

1
Dinesh Rajan

onchange Eventを使用できますか

<form name="myform" id="myform" action="action.php">
<input type="hidden" name="myinput" value="0" onchange="this.form.submit()"/>
<input type="text" name="message" value="" />
<input type="submit" name="submit" onclick="DoSubmit()" />
</form>
0
iCrazybest

これはあなたを助けるかもしれません。

あなたのHTML

<form id="myform" action="action.php">
<input type="hidden" name="myinput" value="0" />
<input type="text" name="message" value="" />
<input type="submit" name="submit" onclick="save()" />
</form>

あなたのスクリプト

    <script>
        function save(){
            $('#myinput').val('1');
            $('#form').submit();
        }
    </script>
0
Saif Zakir