PDA

View Full Version : Ext.Msg.show()



vms.saran
12 Aug 2010, 2:34 AM
hi all..

I am new to Extjs.. I am having one doubt ....
The following code doesnt work.. pls help me what is the error on the code.



Ext.Msg.show({
title:'Save Changes?',
msg: 'Your are closing a tab that may have unsaved changes. Would you like to save your changes as draft?',
buttons: Ext.Msg.YESNOCANCEL,
fn: showResult,
animEl: 'elId',
icon: Ext.MessageBox.QUESTION
});
function showResult(btn){
if(btn == 'yes'){
alert('inside yes')
Ext.getCmp('tabs').remove('tabPanel-'+title);
}
}

jarrednicholls
12 Aug 2010, 12:58 PM
Hi vms.saran,

The "showResult" function is not defined at the time you are calling Ext.Msg.show(). When you are specifying "fn: showResult" you are essentially passing an undefined variable to that function call. If you place showResult above the call to Ext.Msg.show(), then your code will work. Javascript (like all interpreted languages) evaluates from the top-down.



function showResult(btn){
if(btn == 'yes'){
alert('inside yes')
Ext.getCmp('tabs').remove('tabPanel-'+title);
}
}
Ext.Msg.show({
title:'Save Changes?',
msg: 'Your are closing a tab that may have unsaved changes. Would you like to save your changes as draft?',
buttons: Ext.Msg.YESNOCANCEL,
fn: showResult,
animEl: 'elId',
icon: Ext.MessageBox.QUESTION
});

vms.saran
12 Aug 2010, 9:21 PM
hi jarrednicholls,


Still it is not working ......

jarrednicholls
12 Aug 2010, 9:27 PM
Ok, well are you getting an error message? If so, what is it? The code looks okay to me, so something outside of the context of the code is incorrect. e.g., this is being called outside of an Ext.onReady(), or "elId" doesn't exist [yet], or any number of things.

vms.saran
12 Aug 2010, 9:41 PM
hi jarrednicholls,

This is the actual code i am working on nw...



Ext.getCmp('tabPanel-'+title).on('beforeclose', function(){
function showResult(btn){
if(btn == 'yes'){
alert('inside yes')
Ext.getCmp('tabs').remove('tabPanel-'+title);
}
}
Ext.Msg.show({
title:'Save Changes?',
msg: 'Your are closing a tab that may have unsaved changes. Would you like to save your changes as draft?',
buttons: Ext.Msg.YESNOCANCEL,
fn: showResult
});
return true;
});

vms.saran
12 Aug 2010, 9:42 PM
hi jarrednicholls,

This is the code in which i am working on now...


Ext.getCmp('tabPanel-'+title).on('beforeclose', function(){
function showResult(btn){
if(btn == 'yes'){
alert('inside yes')
Ext.getCmp('tabs').remove('tabPanel-'+title);
}
}
Ext.Msg.show({
title:'Save Changes?',
msg: 'Your are closing a tab that may have unsaved changes. Would you like to save your changes as draft?',
buttons: Ext.Msg.YESNOCANCEL,
fn: showResult
});
return true;
});

j-joey
17 Aug 2010, 10:42 AM
javascripts native alert and confirm methods will suspend javascript execution until user acts. so i can say they are sync.

unlike native methods, Ext.Message methods aren't sync. they are async... i mean, when you call Ext.Msg.alert, Ext.Msg.show it'll not wait for user to act. so you need another approach...

when beforeclose event fires, it'll call your user-function. and if the function returns false, it will not let the panel close. we need users choice to close the panel or not. if we use native confirm method, it suspends the function where we call it until user makes a choice. then it resumes the function so we can get the users selection and return true or false.

but when we use Ext.Message components, it just draws a non-native messagebox into page, binds events to non-native buttons then resumes the function. it doesn't wait user to make a choice. ( as a bad idea ) we might force it to wait by a simple infinite loop until users makes a choice. but this will block the browser.

so what can we do!

when we need beforeclose confirmation, we always return false to prevent closing. then in callback function of message box, we manually close the panel if close action needed. and one more tip, to prevent re-confimation we need to bypass the events.


Ext.getCmp('tabPanel-'+title).on('beforeclose', function(){

function showResult(btn){
if (btn == 'no'){ // close the tab
Ext.getCmp('tabs').remove('tabPanel-'+title);
} else if (btn == 'yes') { // save

} else { // otherwise cancel

}
}

Ext.Msg.show({
title:'Save Changes?',
msg: 'Your are closing a tab that may have unsaved changes. Would you like to save your changes as draft?',
buttons: Ext.Msg.YESNOCANCEL,
fn: showResult
});

return false;
});

mkm_2013
13 Nov 2013, 7:31 AM
I have recently migrated the app from 3.2 to4.2
The Ext.Msg.alert,show,prompt is not working. Nothing is displayed.
Here is my code
Ext.Msg.show({
title: 'Warning',
msg: resp.responseText.replace("ERROR:", ""),
icon: Ext.window.MessageBox.INFO,
closable: false,
buttons: Ext.MessageBox.YESNO,
buttonText: {
//requirement - reverse the buttons
yes: 'Do Not Lock Subject(s)',
no: 'Lock Subject(s)'
},
fn:function(btn) {

switch(btn) {
case 'no' : //actually means 'Lock'

updateParams.userReviewed = true;

Ext.Ajax.request({
url:'/stdy/admin/subject/servlet/LockUnlockSubjects.do',
params: updateParams,

callback: function(opt, ok, resp) {
Ext.Msg.alert('Information', 'Selected subjects have been successfully locked.');

subjectStore.load({
params:{
start:(page - 1) * 15,
limit:15
}
});
}

});
break;
case 'yes' : //actually means 'Do not lock'
break;
}
}
});
Please help me. I am stuck with this