How To Dialog?

  • 4
  • 2
  • Question
  • Updated 5 days ago
  • Doesn't Need an Answer
  • (Edited)
How To Dialog?

This demo demonstrates eight different examples of invoking a Dialog Box through a Button to (1) display selected information to a user, (2) rapidly make quick changes to fields in a record, or (3) initiate more complex processing tasks. 

Motivation: There are a tremendous number of use cases where a user wants to seamless perform an action without extra navigational steps or page reloads. These actions might be as simple as displaying record information in a compact manner or rapidly editing specific fields. Additionally, when some actions require user input as a parameter to that action, it is often undesirable to store those parameters in a field or create faux relationships to fit the action into a native capability. Finally, complex processing tasks that manipulate multiple tables, records and fields and can be made more accessible by binding those actions to a Button rather than separately loading a HTML code page that contains its own interface and controls.

This demo is large only because it jams eight different examples into one application.

How To Dialog? ~ Clients Table Dashboard

Pastie Database

Button 1 ~ Display Static Instructions (Full HTML Allowed)


Button 2 ~ Display Field Information With Clipboard Copy


Button 3~ Display Lots of Field Information


Button 4 ~ Display Parent and Child Informaiton


Button 5 ~ Rapidly Edit Status Without Page Load


Button 6 ~ Rapidly Edit Date With Inline Calendar Widget


Button 7 ~ Rapidly Edit Child Records (Delay Meeting Date)


Button 8 ~ Rapidly Edit Child Records (Reset Meeting Time)


I would normally add technical notes here but they are potentially so extensive that I am not going to be able to add them in the initial post before someone cuts off my opportunity by commenting. Add your comments or questions and I will follow up separately with detailed notes.
Photo of Ⲇanom the ultimate (Dan Diebolt)

Ⲇanom the ultimate (Dan Diebolt), Champion

  • 26,322 Points 20k badge 2x thumb

Posted 5 months ago

  • 4
  • 2
Photo of Carlos


  • 644 Points 500 badge 2x thumb
Hi Dan, this one is great!!
I have a question.. how can I change the button after it was clicked, without changing all buttons displayed? I'm using one of these buttons in a table, so 28 records appear in an embedded table in a parent record. When clicked, the action executes on the selected record but all buttons in all records change to "done".

I'm using this code currently:


Appreciate any help!
Photo of Ⲇanom the ultimate (Dan Diebolt)

Ⲇanom the ultimate (Dan Diebolt), Champion

  • 26,272 Points 20k badge 2x thumb
A class is used on the button to make it simple to define the click handler when the field is used in a report and there are multiple buttons.
[iol] & "module.js" & [/iol]
"<a class='QBU_Button Vibrant Success' " &
"  data-rid='" & [Record ID#] & "'" &
Within the click handler you can refer to the specific button that was clicked on by referencing this either as a variable or as the argument of $(this):

  $("a.QBU_Button").on("click", function(event) {
    var rid = this.dataset.rid;