我正在尝试弹出一个警告弹出窗口,其中有一个复选框,用户需要在其中检查并单击“提交”以继续。
我使用 div标记来定义必须在警报上显示的警报消息,然后编写一些java脚本来返回值。
带有警告信息的div标签:
<div id="confirm_popup" style="color:red">
<input type="checkbox" id="myCheckBox" /> Check in to confirm the following actions to take place and click OK
<div style="margin-top: 15px; font-weight: bold; color:red; ">
<p>* You will not be able to make additional changes to your current reporting period. It is very important to review your credits. </p>
<p>* A new two-year reporting period tab will open. </p>
</div>
</div>
我的javascript代码:
<script type="text/javascript">
$('#close_record').submit(function() {
var status = false
$("#confirm_popup").html("Hi message!!!").dialog({
modal: true,
title: 'Alert Message', zIndex: 10000, autoOpen: true,
width: 'auto', resizable: false,
buttons: {
Ok: function () {
$(this).dialog("close");
if ($('#myCheckBox').is(":checked")){
status = true
}
},
},
close: function (event, ui) {
$(this).remove();
}
});
if(status == true){
return true
}
else {
false
}
})
</script>
close_record是我有提交按钮的表单的ID。我正在使用表单提交操作来触发弹出的javascript。
但由于某种原因,这是行不通的..我已经尝试了所有可能的方法,我能想到并且没有任何帮助..任何帮助都表示赞赏!
由于
答案 0 :(得分:0)
您需要在对话框关闭后触发submit
事件。
在OK功能中,您需要检测复选框,然后执行以下操作:
$('#yourForm').trigger('submit');
避免异步方法中的变量,该值不是您需要的或您的想法。
答案 1 :(得分:0)
请改为尝试:
<form id="close_record">
<input type="checkbox" style="display: none" id="myCheckBoxForm" />
<input type="submit" value="go" />
</form>
<div id="confirm_popup" style="color:red">
<input type="checkbox" id="myCheckBox" />Check in to confirm the following actions to take place and click OK
<div style="margin-top: 15px; font-weight: bold; color:red; ">
<p>* You will not be able to make additional changes to your current reporting period. It is very important to review your credits.</p>
<p>* A new two-year reporting period tab will open.</p>
</div>
</div>
和JS:
$('#close_record').submit(function (e) {
if ($('#myCheckBoxForm').is(":checked")) {
return true;
} else {
e.preventDefault();
}
$("#confirm_popup").dialog({
modal: true,
title: 'Alert Message',
zIndex: 10000,
autoOpen: true,
width: 'auto',
resizable: false,
buttons: {
Ok: function () {
$(this).dialog("close");
$('#myCheckBoxForm').prop('checked', $('#myCheckBox').prop('checked'));
},
}
});
})