I want to execute a Ext.Msg.show() function synchronously in ExtJs-5
onButtonClick : function() {
1. some code...
2. Ext.Msg.show({
title : 'Confirm Please',
msg : 'Please be informed that record will only save when click ok.',
buttons : Ext.Msg.OKCANCEL,
icon : Ext.Msg.QUESTION,
fn : function(btn) {
if ('cancel' === btn) {
return;
}
}
});
3. other message box ...
4. other code ...
}
The above function execute synchronously each step 1, 2, 3 & 4 but doesn't wait for user interaction on step 2. It directly move to step 3 and after that to step 4. But I want to execute step 3 only when user click on ok else terminate other below steps.
Can anybody check and let me know the possible code that I need to add to make it possible? Thanks
There is an easier and integrated way to accomplish a confirm window: Ext.Msg.confirm .
Remember that a "confirm" in ExtJs is ASYNCHRONOUS compared to the one of pure javascript. So your step 3/4 should be moved to the btnId==yes condition block:
Below an example:
Ext.Msg.confirm("Confirm", "Are you sure?", function(btnId){
if(btnId == "yes"){
// User clicked YES
// Move here step 3/4
}
else {
// User clicked NO
}
});
Bonus Tip: nothing stops you from nesting a confirm in a confirm like this:
// Confirm #1
Ext.Msg.confirm("Confirm", "Are you sure?", function(btnId){
if(btnId == "yes"){
// User clicked YES
// Confirm #2
Ext.Msg.confirm("Confirm", "Are you REAAALLY sure?", function(btnId){
if(btnId == "yes"){
// User clicked YES
}
else {
// User clicked NO
}
});
}
else {
// User clicked NO
}
});