Date: 2019oct28
Language: javaScript
Q. jQueryUI: Example modal dialog
A.
function exampleDlg() {
const dlg = prepModalDiv('my_unique_id');
dlg.html('Loading...');
$.get('<my-url>', function(data) {
dlg.html(data);
});
const buttons = [
btn('OK', function() { /* Do something */ dlg.dialog('close'); }),
btn('Cancel', function() { dlg.dialog('close'); }),
];
dlg.dialog({
width: '55%',
height: '300',
title: 'My Dialog',
modal: true,
autoOpen: true,
closeOnEscape: false,
buttons: buttons
});
};
Helper functions
function prepDialogDiv(id) {
var dlg = $('#' + id);
if (dlg.length == 0) {
$(document.body).append('<div id=' + id + '></div>');
dlg = $('#' + id);
}
else {
dlg.html('');
}
return dlg;
}
function btn(text, click) {
return { text: text, click: click };
}