mksrom
October 16, 2015, 10:59am
1
Hi guys !
I’d like to develop a way to edit the ‘encounter date’ when an Encounter is created for a past visit.
I was thinking of a popup dialog, such as the one suggested in the style guide (used throughout the application)
Something like this:
Q1: Is there a documentation article on how to use/create dialogs ?
I think I understood how to create it using emr.setupConfirmationDialog() JS function.
that way:
var editEncounterDateDialog = null;
function showEditEncounterDateDialog() {
if (!editEncounterDateDialog) {
editEncounterDateDialog = emr.setupConfirmationDialog({
selector: '#encounter-date-dialog',
actions: {
confirm: function() {
//console.log("confirmed");
$("#encounter-date-dialog").hide();
$().toastmessage( 'showToast', { type: 'success',
position: 'top-right',
text: successMessage } );
return true;
}
}
});
}
editEncounterDateDialog.show();
}
But I face one problem: how to close my popup window ?
The $("#encounter-date-dialog").hide(); doesn’t focus well after popup is hidden (user has to click on a section on the left to be able enter obs again).
Looking at the emr.setupConfirmationDialog() function, it looks like there is things available to close my dialog box:
element.find(".confirm").unbind('click');
element.find(".confirm").click(opts.actions.confirm);
}
if (opts.actions.cancel) {
element.find(".cancel").unbind('click');
element.find(".cancel").click(opts.actions.cancel);
}
}
var dialogApi = {};
var dialogOpts = {
overlayClose: true,
overlayId: "modal-overlay",
opacity: 80,
persist: true,
closeClass: "cancel"
};
if (opts.dialogOpts) {
$.extend(dialogOpts, opts.dialogOpts);
}
or
persist: true,
closeClass: "cancel"
};
if (opts.dialogOpts) {
$.extend(dialogOpts, opts.dialogOpts);
}
dialogApi.show = function() {
$.modal($(opts.selector),dialogOpts);
};
dialogApi.close = function() {
$.modal.close();
};
return dialogApi;
},
stripAccents: function(term) {
var ret = "";
for ( var i = 0; i < term.length; i++ ) {
ret += accentMap[ term.charAt(i) ] || term.charAt(i);
But don’t really know how to use that.
Q2: How to close a dialog widget ?
darius
October 16, 2015, 2:17pm
2
@mksrom by the way, more recently I have come to prefer using this dialog approach: https://wiki.openmrs.org/x/GABXB (this assumes you are writing angular code though).
Peeking at emr.setupConfirmationDialog code, I see that the object it returns has a close() function (see https://github.com/openmrs/openmrs-module-uicommons/blob/master/omod/src/main/webapp/resources/scripts/emr.js#L295 ) and this is what you should be calling instead of {jqselector}.hide()…
If that doesn’t automatically focus the right field, then you’ll need to add a code snippet to do this…
mksrom
October 19, 2015, 5:57am
3
@darius , I am using the widget in an HtmlFormEntry form.
The first option works perfect.
Thanks.
