-
-
Save mxriverlynn/45b82b769b71ff771f10 to your computer and use it in GitHub Desktop.
managing modal dialogs with promises
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
orgChart = { | |
addNewEmployee: function(){ | |
var employeeDetail = this.getEmployeeDetail(); | |
employeeDetail.on("cancel", () => { | |
// the modal was cancelled... | |
// go back to previous UI / step / whatever | |
}); | |
employeeDetail.on("complete", (detail) => { | |
// the detail was entered. use it wherever | |
// and then move the UI forward to the next step | |
}); | |
}, | |
getEmployeeDetail: function(){ | |
var form = new EmployeeDetailForm(); | |
form.render(); | |
// use a modal dialog, here | |
$("#my-modal").modal(form.el); | |
return form; | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
orgChart = { | |
addNewEmployee: function(){ | |
var employeeDetail = this.getEmployeeDetail(); | |
employeeDetail.on("close", (result) => { | |
if (result.cancelled) { | |
// the modal was cancelled... | |
// go back to previous UI / step / whatever | |
} else { | |
// it was completed | |
// pass any data needed as "result.data" and | |
// use that data wherever it is needed | |
// then move the UI forward to the next step | |
} | |
}); | |
}, | |
getEmployeeDetail: function(){ | |
var form = new EmployeeDetailForm(); | |
form.render(); | |
// use a modal dialog, here | |
$("#my-modal").modal(form.el); | |
return form; | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
new Promise((resolve, reject) => { | |
// some work was done | |
resolve(result); | |
//or | |
// the work failed | |
reject(reason); | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var p = new Promise(function(resolve, reject){ | |
reject("some reason"); | |
}); | |
function onReject(reason){ | |
console.log(reason); | |
} | |
p.then(undefined, onReject) | |
p.catch(onReject); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var p = new Promise(function(resolve, reject){ | |
throw new Error("some error"); | |
}); | |
function onReject(reason){ | |
console.log(reason); | |
} | |
p.then(undefined, onReject); | |
p.catch(onReject); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
orgChart = { | |
addNewEmployee: function(){ | |
var employeeDetail = this.getEmployeeDetail(); | |
employeeDetail.then((result) => { | |
if (result.cancelled) { | |
// the modal was cancelled... | |
// go back to previous UI / step / whatever | |
} else { | |
// it was completed | |
// pass any data needed as "result.data" and | |
// use that data wherever it is needed | |
// then move the UI forward to the next step | |
} | |
}); | |
}, | |
getEmployeeDetail: function(){ | |
var formP = ... // some code to get a promise from the dialog | |
return formP; | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment