0
所以我有一个页面会有多个模态弹出窗口。 每个人都有需要通过表单发送回页面的值。jQuery多模态对话框
为了确保每个对话框都位于每个对话框定义末尾的.parent().appendTo("#frmMain");的表格中。
我的问题来了，当有多个模态声明。最后一行.parent().appendTo("#frmMain");完成的模式是唯一一个通过表单发回其值的模式。
代码是相当多的，但希望尽可能多地离开。
另外：所以我有两个模态工作，第三个不是。 select和textarea的工作和正常inout不一样。不知道为什么，任何帮助将不胜感激
我已经解除了大多数代码从例子
HTML
<div id="edit-jde-number-dialog-form" title="Edit JdeNumber" style="display:none">
<p class="validatejde"></p>
<label for="jdenumber">JdeNumber: </label>
<input type="text" name="NewJdeCustomerNumber" id ="NewJdeCustomerNumber" class="text ui-widget-content ui-corner-all" size="25"> </input>
</div>
<!-- add Item Waive reason -->
<div id="waive-incident-billing-ITEM-form" title="Reason for waiving individual item" >
<p class="validateItemWaive" style="padding:2px"></p>
<label >Select a reason for waiving: </label>
<select name="ItemWaiveReason" id="ItemWaiveReason">
<option value="reason1">Reason1</option>
<option value="reason2">Reason2</option>
</select>
</div>
<!-- Add comment -->
<div id="add-incident-billing-comment-form" title="Add a comment" style="display:none">
<p class="validatecomment" style="padding:2px"></p>
<textarea name="incidentbillingcomment" id="incidentbillingcomment" width="100%" class="text ui-widget-content ui-corner-all"></textarea>
</div>
的Javascript
$(document).ready(function() {
// ------------------------------- For editing jde --------------------------------------
var jdenumber = $("#jdenumber"),
jdenumberAllFields = $([]).add(jdenumber);
$("#edit-jde-number-dialog-form").dialog({
autoOpen: false,
height: 300,
width: 350,
modal: true,
buttons: {
'Change JdeNumber': function() {
var bValid = true;
jdenumberAllFields.removeClass('ui-state-error');
var jdeNo = $("#NewJdeCustomerNumber");
if (checkNotEmpty(jdeNo) == false) {
var tips = $(".validatejde");
updateTips(tips, "You must enter a jde number")
bValid = false;
}
if (bValid) {
$(this).dialog('close');
SubmitAction('UpdateJDECustomerNumber');
}
},
Cancel: function() {
$(".validatejde").text("");
$(this).dialog('close');
}
},
close: function() {
jdenumberAllFields.val('').removeClass('ui-state-error');
}
}).parent().appendTo("#frmMain"); //puts the modal in the form
$('#button-change-jde-number')
.button()
.click(function() {
$('#edit-jde-number-dialog-form').dialog('open');
});
// --------------------------- for adding a comment --------------------------------------
var incidentbillingcomment = $("#incidentbillingcomment"),
incidentbillingcommentAllFields = $([]).add(incidentbillingcomment);
$("#add-incident-billing-comment-form").dialog({
autoOpen: false,
height: 350,
width: 410,
modal: true,
buttons: {
'Add Comment': function() {
incidentbillingcommentAllFields.removeClass('ui-state-error');
var commenttext = jQuery.trim($("#incidentbillingcomment").text());
var bValid = (commenttext.length > 0);
if (bValid) {
SubmitAction('AddGeneralComment');
}
else {
var tips = $(".validatecomment");
updateTips(tips, "You cannot add an empty comment.");
}
},
Cancel: function() {
$(".validatecomment").text("");
$(this).dialog('close');
}
},
close: function() {
incidentbillingcommentAllFields.val('').removeClass('ui-state-error');
}
}).parent().appendTo("#frmMain"); //puts the modal in the form
$('#add-incident-billing-comment')
.button()
.click(function() {
$("#add-incident-billing-comment-form").dialog('open');
});
// ----------------------------- For giving a ITEM Waive reason -----------------------------------
var removalreasoncombo = $("#ItemWaiveReason"),
removalreasonAllFields = $([]).add(removalreasoncombo);
$("#waive-incident-billing-ITEM-form").dialog({
autoOpen: false,
height: 350,
width: 410,
modal: true,
buttons: {
'Waive Item': function() {
var bValid = true;
removalreasonAllFields.removeClass('ui-state-error');
var selectedreasonvalue = $("#ItemWaiveReason option:selected");
var removalreasonkey = removalreasoncombo.val();
if (checkStringNotEmpty(selectedreasonvalue) == false) {
var tips = $(".validateItemWaive");
updateTips(tips, "You must select a waive reason.")
bValid = false;
}
if (bValid) {
$(this).dialog('close');
//bag of shite, it doesn't want to find the select using normal stuff so have hacked t together. NOOOOOOOO!
$("#NewItemWaiveReason").val(removalreasonkey);
SubmitAction('WaiveIncidentBillingITEM');
}
},
Cancel: function() {
$(".validateremoval").text("");
$(this).dialog('close');
}
},
close: function() {
removalreasonAllFields.removeClass('ui-state-error');
}
}).parent().appendTo("#frmMain"); //puts the modal in the form
});