window.alert() preceding jquery dialog popup
I am using jQuery dialog plugin because i need to make decision upon user click
here is my code
<script type='text/javascript'>
$(function() {
//destroying dialog
$('#rdy').tipsy();
$('#flt').tipsy();
$('#num').tipsy();
$('#tpe').tipsy();
$('#reg').tipsy();
$('#etd').tipsy();
$('#dla').tipsy();
$('#dp').tipsy();
$('#rem').tipsy();
$('#to').tipsy();
$('#eta').tipsy();
$('#arr').tipsy();
});
$(function(){
var fDep=document.forms.fDep;
var flt=fDep.elements['flt[]'];
var num=fDep.elements['num[]'];
var reg=fDep.elements['reg[]'];
var etd=fDep.elements['etd[]'];
var dla=fDep.elements['dla[]'];
var dep=fDep.elements['dep[]'];
var eta=fDep.elements['eta[]'];
var arr=fDep.elements['arr[]'];
for (var i=0;i<flt.length;i++){
//var aCtrl=ctrls[i];
//window.alert(etd[i].value);
$(flt[i]).mask("aa?a");
}
for (var i=0;i<num.length;i++){
//var aCtrl=ctrls[i];
//window.alert(etd[i].value);
$(num[i]).mask("99?999");
}
for (var i=0;i<etd.length;i++){
//var aCtrl=ctrls[i];
//window.alert(etd[i].value);
$(etd[i]).mask("99:99");
}
for (var i=0;i<dla.length;i++){
$(dla[i]).mask("99:99");
}
for (var i=0;i<dep.length;i++){
$(dep[i]).mask("99:99");
}
for (var i=0;i<eta.length;i++){
$(eta[i]).mask("99:99");
}
for (var i=0;i<arr.length;i++){
$(arr[i]).mask("99:99");
}
for (var i=0;i<reg.length;i++){
$(reg[i]).mask("99?9999");
//$(reg[i]).css("color","#ff00ff");
}
});
$(".edit_tr").change(function(){
//window.alert($(this).attr('id'));
var rowID=$(this).attr('id');
//window.alert($("#dep" + rowID).val());
var sendReq;
var flt=$("#flt"+rowID).val();
var num=$("#num"+rowID).val();
var tpe=$("#tpe"+rowID +" option:selected").val();
var reg=$("#reg"+rowID).val();
var etd=$("#etd"+rowID).val();
var dla=$("#dla"+rowID).val();
var dep=$("#dep"+rowID).val();
var rem=$("#rem"+rowID).val();
var city=$("#city"+rowID +" option:selected").val();
var eta=$("#eta"+rowID).val();
var arr=$("#arr"+rowID).val();
//window.alert();
var dataStr="flt="+flt+"&"
+"num="+num+"&"
+"tpe="+tpe+"&"
+"reg="+reg+"&"
+"etd="+etd+"&"
+"dla="+dla+"&"
+"dep="+dep+"&"
+"rem="+rem+"&"
+"city="+city+"&"
+"eta="+eta+"&"
+"arr="+arr;
//window.alert(dataStr);
$("#dialog-confirm" ).dialog({
resizable: false,
height:140,
modal: true,
buttons: {
"Сохранить": function() {
$("#ico"+rowID).html("<img src='images/indic.gif' />");
$( this ).dialog( "close" );
sendReq=true;
开发者_JAVA百科 },
"Отмена": function() {
$("#ico"+rowID).html("");
$( this ).dialog( "close" );
}
}
});
if (sendReq==true){
$.ajax({
type: "POST",
url: "updFlt.php",
data: dataStr,
cashe: false,
success: function(html){
$("#ico"+rowID).html("");
window.alert("It's ok");
}
});
}else
{
window.alert("false");
}
});
</script>
that's I have dialog popup that has 2 buttons when user clicks the first button I need to send data using ajax else cancel...
$("#dialog-confirm" ).dialog({
resizable: false,
height:140,
modal: true,
buttons: {
"Сохранить": function() {
$("#ico"+rowID).html("<img src='images/indic.gif' />");
$( this ).dialog( "close" );
sendReq=true;
},
"Отмена": function() {
$("#ico"+rowID).html("");
$( this ).dialog( "close" );
}
}
});
after that i do checking and send to server using ajax
if (sendReq==true){
$.ajax({
type: "POST",
url: "updFlt.php",
data: dataStr,
cashe: false,
success: function(html){
$("#ico"+rowID).html("");
window.alert("It's ok");
}
});
}else
{
window.alert("false");
}
});
The result which I'm getting is that window.alert("false");
-this line of code gets executed before jQuery dialog popup!! Why it is so??? When I run my web app and change table row standard alert pops up first(modal form) then I reach confirm-dialog
$("#dialog-confirm" ).dialog() popup though this line of code precedes standard alert call !!!
change the code to this:
$("#dialog-confirm" ).dialog({
resizable: false,
height:140,
modal: true,
buttons: {
"Сохранить": function() {
$("#ico"+rowID).html("<img src='images/indic.gif' />");
$( this ).dialog( "close" );
$.ajax({
type: "POST",
url: "updFlt.php",
data: dataStr,
cashe: false,
success: function(html){
$("#ico"+rowID).html("");
window.alert("It's ok");
}
});
},
"Отмена": function() {
$("#ico"+rowID).html("");
$( this ).dialog( "close" );
}
}
});
sendReq is being read in-line and written asynchronously. This means that the code gets to if( sendReq == true )
right away and the value is assigned after the alert has already happened. The easy fix? Move $.ajax into the button handler:
buttons: {
"Сохранить": function() {
$("#ico"+rowID).html("<img src='images/indic.gif' />");
$( this ).dialog( "close" );
$.ajax({
type: "POST",
url: "updFlt.php",
data: dataStr,
cashe: false,
success: function(html){
$("#ico"+rowID).html("");
window.alert("It's ok");
}
});
},
"Отмена": function() {
$("#ico"+rowID).html("");
$( this ).dialog( "close" );
}
}
mybe u can use this
$("#dialog-confirm" ).dialog({
resizable: false,
height:140,
modal: true,
buttons: {
"Сохранить": function() {
$("#ico"+rowID).html("<img src='images/indic.gif' />");
var dlg = this;
call_ajax(function(){
$("#ico"+rowID).html("");
window.alert("It's ok");
$(dlg).dialog( "close" );
});
},
"Отмена": function() {
$("#ico"+rowID).html("");
$( this ).dialog( "close" );
}
}
});
ajax
function call_ajax(call_back){
$.ajax({
type: "POST",
url: "updFlt.php",
data: dataStr,
cashe: false,
success: function(html){
call_back();
}
});
}
精彩评论