Button event

Customizing Buttons with Ninext

With Ninext, you can modify the appearance of Ninox buttons by defining a function called onUpdate in the "Display only if" trigger. This function must return an object describing the visual elements to be modified, and the script must end with a Boolean indicating whether the button should be displayed.

Using this approach, you can:

• Change the button's caption.
• Update the tooltip (or title) of the button.
• Change the button's color using predefined classes.
• Display a badge to highlight important information.

Quick Overview of JSON Properties

Property	Description	Example / Usage
caption	The text displayed on the button.	"Send" / "Cancel"
tooltip or title	The text shown when hovering, as a tooltip.	"Click to send"
buttonColor	The color class to apply to the button (e.g., "blue", "red", "grey").	"blue"
badge	An object describing the badge to display on the button.	See details below
badge.caption	The text, number, or symbol displayed on the badge.	"3" or "!"
badge.color	The badge color (either default or customized).	"red" or "#4970ff"

General Workflow

1. Define the onUpdate Function
   In the code of the button's "Display only if" trigger, declare a function called onUpdate. This function returns an object (in JSON format) describing the elements to modify.
2. Return a Boolean for Visibility
   The trigger must end by returning a Boolean (true or false) to indicate whether the button should be displayed.
3. Ninext Applies the Modifications
   When the record is opened or refreshed, Ninext executes the onUpdate function, reads the returned object, and dynamically applies the appearance changes to the button.

Implementation

Single Code Block in the "Display only if" Trigger

"Declaration of the onUpdate function that customizes the button";
function onUpdate(buttonValues : any) do
 let count := this.Count;
 {
      caption: if count > 0 then
          "Send (" + count + ")"
      else
          "Send"
      end,
      tooltip: "Click to send your request",
      buttonColor: if count > 0 then "red" else "blue" end,
      badge: {
           caption: if count > 0 then text(count) else "" end,
           color: "red"
      }
 }
end;

"Determination of the button's visibility";
this.Count >= 0

Comments:

• The onUpdate function builds an object that allows modifying the button caption (with a numerical indicator if Count is positive), the tooltip, the button color, and displaying a badge.
• The final block of code returns a Boolean to determine whether the button should be displayed.

Minimal Example (Badge Only)

"Declaration of the onUpdate function to display only a badge";
function onUpdate(buttonValues : any) do
 let newItems := this.newItems;
 {
      badge: {
           caption: if newItems > 0 then text(newItems) else "" end,
           color: "red"
      }
     }
end;
"The button is always displayed";
true

Comments:

• Only the badge property is returned to display a value if NewItems is greater than 0.
• The button is displayed unconditionally.

Important Points

• Final Boolean Return
  Without returning true or false at the end, the button will not be visible.