jQuery ダイアログ ボタンは無視されました。フォームの送信を続行します
<p>次のフォーム コードがあり、JavaScript コードを以下に示します。問題は、<code>validateDialogForm()</code> を実行すると、特定の条件が満たされると、jquery ダイアログ ボックスが表示されることです。確かにダイアログが数秒間表示されるのがわかりますが、ダイアログはそこに留まらず、フォームは引き続き送信されます。フォームを一定期間一時停止し、ユーザーが <code>Save</code> ボタンをクリックした場合にのみ送信するようにしたいと考えています。フォームが送信されないように、<code>return false;</code> 関数の終わりの前に <code>validateDialogForm()</code> を追加しようとしましたが、ダイアログの保存ボタンをクリックすると、フォームの送信は続行されず、そのまま残ります。ここで私は何を間違っているのでしょうか?以下のコードの現在の状態では、jquery ダイアログに関係なくフォームは送信され続けます。(清晰起见,删除很多不相關的代コード)</p>
<p><br /></p>
<pre class="brush:js;toolbar:false;">$('#checklist_dialog').hide();
関数 validateDialogForm() {
$('#checklist_dialog').show();
var isconfirmed = false;
//STEP:1 オプション B が選択されているかどうかを確認します。
var selectedVal = "";
var selected = $("input[type='radio'][name='sampleChoice']:checked");
if (selected.length > 0) {
selectedVal = selected.val();
console.log("選択されたオプションは " selectedVal);
}
if (selectedVal === "choiceB") {
if ($("#choiceBstatus").val() === "true") {
//ダイアログボックスを表示する
$('#checklist_dialog').dialog({
モーダル: true、
最大幅: 600、
最大高さ: 500、
幅: 600、
高さ: 500、
かぶせる: {
不透明度: 0.7、
背景:「黒」
}、
ボタン: {
"保存": function() {
$(this).dialog('close');
alert("クリックされたSAVEボタン内");
$("#choiceBstatus").val("false");
//isconfirmed = true;
true を返します。
}、
"キャンセル": function() {
$(this).dialog('close');
alert("フォームを保存する前に、チェックリストを完了/保存する必要があります!");
// false を返します。
}
}
});
/* e.preventDefault();
false を返します。 */
} // if($("#choiceBstatus").val() == true ){の終わり
if ($("#choiceBstatus").val() === "false") {
// true を返します。
}
} // if(selectedVal === "choiceB"){ の終わり
// false を返します。
/* if(isconfirmed){
true を返します。
}
それ以外 {
false を返します。
}
*/
}</pre>
<pre class="brush:html;toolbar:false;"><form id="orderForm" action="/mywebsite/order.htm" method="POST" onsubmit="return (validateOrderForm(this) &) ;& validateDialogForm())">
<input id="choiceBstatus" name="choiceBstatus" type="hidden" value="true">
<div id="ownerDisplayFields" style="visibility:visible;">
<テーブルクラス="noPrint">
//いくつかの div
</tbody>
</テーブル>
</div>
<div id="pManualTitle" style="表示: ブロック">
<テーブルクラス="noPrint">
<みんな>
</tbody>
</テーブル>
</div>
<div id="checklist_dialog" title="新しいタイトル" style="表示: なし;">
<p>チェックリスト 1 はここにあります</p>
<p>チェックリスト 2 はここにあります </p>
</div>
<テーブルクラス="noPrint">
<みんな>
<tr>
<td align="center"><br>
<input class="button" type="submit" name="save" value="保存"> - <input class="button" type="submit" name="cancel" value="Cancel" onclick="bCancel = true;">
</td>
</tr>
</tbody>
</テーブル>
<div></div>
</form></pre>
<p><br /></p>