- 締切済み
Ajaxの使い方がおかしいでしょうか?
Javascript の初級者です。 今、Formを使って更新処理しようとしています。 同時に、submitが押されたときに、データをチェックするために関数に 飛ばしています。 ★印のところだけが「true」で他のところは「false」なので処理を中断させたいと 考えています。 Ajaxを非同期で実行すると訳が分からなくなってしまったので同期処理にしています。 ところがどのような条件でsubmitしてもFromが実行されてしまいます。 Ajaxの success 下にこのような分岐処理を書くのは間違いなんでしょうか。 どなたかお分かりになる方、ご指導下さい。 よろしくお願いします。 function upadateCheck(){ var strYear = $("#year").val(); var strMonth = $("#month").val(); var strClosingDate = $("#closingDate").val(); $.ajax({ async: false, // 同期処理 type: "POST", url: "/customercheckclosingdate", data: {"closingDate":strClosingDate,"year":strYear,"month":strMonth,}, dataType: 'text', success: function(request){ var arr = eval(request); var data = arr[0]; if(data.result == "nothing"){ window.alert("指定の「締日」の得意先はありませんでした。"); return false; }else if(data.result == "no"){ window.alert("指定の「処理年月」と「締日」で更新処理を行うには、締日の不整合があります。"); return false; }else{ if(window.confirm("締日:" + strClosingDate + "日\n処理年月:" + strYear + "年" + strMonth + "月\n\nの更新処理を行います。")){ return true; ★★★★★★★★★★★★★★★★ }else{ return false; } } }, error: function(msg){ alert( "Data Saved: " + msg ); return false; } }); } <form method="POST" action="/update" onsubmit="return upadateCheck()"> <table> <tr> <th>締 日:</th> <td> <input type="hidden" id="year" name="year"> <input type="hidden" id="month" name="month"> <SELECT id="closingDate" name="closingDate" > <OPTION value="05">5</OPTION> <OPTION value="10">10</OPTION> <OPTION value="15">15</OPTION> <OPTION value="20">20</OPTION> <OPTION value="25">25</OPTION> <OPTION value="末">末</OPTION> </SELECT> </td> <td colspan="2"> <input type="submit" value="更新処理" /> </td> </tr> </table> </form>
- みんなの回答 (2)
- 専門家の回答
みんなの回答
- shockatz
- ベストアンサー率80% (153/191)
Ajaxの処理プロセスに対する認識が間違っています。 $.ajaxで定義するオブジェクトの"success"属性に指定しているのは、「コールバック」としての関数定義です。 「コールバックバック関数」というのは同期であれ非同期であれ、「応答があれば実行される」イベントハンドラのようなものであり、リニアな処理手順とは別の流れを定義するものです。 なので、その中で"true"や"false"を返しても意味がありません。 主処理の最後に"false"を返すか、submitイベントの既定動作を停止する、"preventDefault();"を使うかして、まずformの自動submitを停止してください。 そのうえで、successコールバックの中で、検証結果がOKであれば、formをsubmit()します。 function(){ _ $.ajax({ _ type: "POST", _ url: "/customercheckclosingdate", _ data: {"closingDate":strClosingDate,"year":strYear,"month":strMonth,}, _ dataType: 'text', _ success: function(request){ _ // 送信結果の評価 検証OKならば、$('#myForm').submit(); _ }, _ error: function(msg){} _ }); _ return false; }
- askaaska
- ベストアンサー率35% (1455/4149)
・FORMのonsubmitを削除 ・更新処理ボタンをsubmitからbuttonに変更 ・更新処理ボタンにonclickで関数hogeを実行 ・関数hogeの先頭でupadateCheckを実行 ・hogeの最後にFORMをsubmit これでやりたいことが可能になると思うわ