onChangeを使用してフォームを送信する方法

Question

フォームに3つの異なるオプションの値を提出する必要がありますが、私はajaxを使用することで非常に慣れていません。私は3つの異なるオプション/選択値のリストを持っています。オプションの1つが選択されると、それは他の2つのオプションをすべて提出します。私は1つのオプションを提出することしかできませんでしたが、残りのオプションを提出することはできませんでした。私はいくつかの専門家の助言が必要です。ありがとうございました！

私はまだそれを動作させることはできませんが、ここで私はそれぞれに異なる3つの選択の名前があることを

<form method="POST" name="step01" action=""> 
    </select name="dayID" onChange="javascript:document.step01.submit()" size="1"> 
    <option value=" ">(please select a country) 
    <option value="1">1 
    <option value="2">2 
    <option value="3">3 

    <option value="4">4 
    <option value="5">5 
    <option value="6">6 
    <option value="7">7 
    </select> 

    </select name="monthID" onChange="javascript:document.step01.submit()" size="1"> 
    <option value=" ">(please select a country) 
    <option value="1">1 
    <option value="2">2 
    <option value="3">3 

    <option value="4">4 
    <option value="5">5 
    <option value="6">6 
    <option value="7">7 
    </select> 

    </select name="yearID" onChange="javascript:document.step01.submit()" size="1"> 
    <option value=" ">(please select a country) 
    <option value="1">1 
    <option value="2">2 
    <option value="3">3 

    <option value="4">4 
    <option value="5">5 
    <option value="6">6 
    <option value="7">7 
    </select> 
</form> 

通知を達成しようとしているより具体的なタスクがあります。 onChangeメソッドを使用してページを更新せずに3つの値をすべて送信したいと思います。誰も簡単なajaxスニペットで私を助けることができますか？あなたが機能を通して、あなたのフォームの値を挿入する必要はありません

url=url+"?"+name+"="+str; 

変数URLからフォーム変数を提出しているように見えます

Answer 1

は、あなたはJavaScriptでそれらを参照することができます。あなたの例では、URLストリングに追加されたものだけを持っています。

var url = "create_notice_request.php?name=" + document.myForm.name.value; 
ajaxRequest.open("GET", url, true); 
ajaxRequest.send(null); 

しかし、あなたはおそらくあなたのために、これは全体の多く簡単にするためjQuery ajaxを使用してになります。

以下は、サーバー側からの応答を返す完全なAJAX関数の例です。 jQueryのは、ちょうど読み関数全体をよりコンパクトかつ容易にするだけでなく、あなたの中に構築されたすべてのブラウザの互換性を与えるだろう。

121     $.ajax({ 
122     type: "GET", 
123     url: "tag.php", 
124     data: 'file=' + file + '&delete=' + todelete, 
125     success: function(){ 
126       //do something on completion 
128     } 
129     });