eLabSDK.GUI.Dialog

Functions

NameDescription
render()Render and display the dialog on the page.

This creates and shows the dialog using the configuration provided during initialization.
Executes the _onAfterCreateDialog callback if configured. Returns the dialog object
for further manipulation. Use this to programmatically display the dialog after creating
the eLabSDK.GUI.Dialog instance.
close() | Close the currently displayed dialog.

This closes the dialog and removes it from the page. Executes the _onAfterCloseDialog
callback if configured. Returns the dialog object. Use this to programmatically close
the dialog from your code, such as after completing an action or on a timeout.
action() | Execute the custom action configured for this dialog.

This triggers the action callback that was provided in the dialog configuration during
initialization. Use this to programmatically execute the dialog's primary action, such
as form submission, data processing, or any custom functionality associated with the dialog.

render()

Render and display the dialog on the page.

This creates and shows the dialog using the configuration provided during initialization.
Executes the _onAfterCreateDialog callback if configured. Returns the dialog object
for further manipulation. Use this to programmatically display the dialog after creating
the eLabSDK.GUI.Dialog instance.

Kind: global function
Returns: Object - The rendered dialog object
Example

// Create and render a dialog
var dialog = new eLabSDK.GUI.Dialog({
  title: 'Confirmation',
  content: 'Are you sure you want to proceed?',
  width: 400,
  height: 200
});
dialog.render();

Example

// Render with callback
var dialog = new eLabSDK.GUI.Dialog({
  title: 'Data Entry',
  content: '<input type="text" id="dataInput" />',
  _onAfterCreateDialog: function() {
    // Focus input after dialog renders
    document.getElementById('dataInput').focus();
  }
});
dialog.render();

close()

Close the currently displayed dialog.

This closes the dialog and removes it from the page. Executes the _onAfterCloseDialog
callback if configured. Returns the dialog object. Use this to programmatically close
the dialog from your code, such as after completing an action or on a timeout.

Kind: global function
Returns: Object - The closed dialog object
Example

// Close dialog after user action
var dialog = new eLabSDK.GUI.Dialog({
  title: 'Processing',
  content: 'Please wait...'
});
dialog.render();

// Close after operation completes
setTimeout(function() {
  dialog.close();
}, 2000);

Example

// Close with callback
var dialog = new eLabSDK.GUI.Dialog({
  title: 'Notice',
  content: 'Operation completed',
  _onAfterCloseDialog: function() {
    console.log('Dialog closed');
    refreshPage();
  }
});
dialog.render();

// Close after user clicks button
document.getElementById('closeBtn').onclick = function() {
  dialog.close();
};

action()

Execute the custom action configured for this dialog.

This triggers the action callback that was provided in the dialog configuration during
initialization. Use this to programmatically execute the dialog's primary action, such
as form submission, data processing, or any custom functionality associated with the dialog.

Kind: global function
Example

// Create dialog with custom action
var dialog = new eLabSDK.GUI.Dialog({
  title: 'Confirm Action',
  content: 'Click OK to proceed',
  action: function() {
    console.log('Action executed!');
    processData();
  }
});
dialog.render();

// Trigger action programmatically
dialog.action();

Example

// Dialog with form submission action
var dialog = new eLabSDK.GUI.Dialog({
  title: 'Submit Data',
  content: '<form id="myForm"><input type="text" name="data" /></form>',
  action: function() {
    var formData = $('#myForm').serialize();
    $.post('/api/submit', formData, function(response) {
      alert('Data submitted successfully');
      dialog.close();
    });
  }
});
dialog.render();

© 2023 eLabNext