Skip to main content
Kinetic Community

Data Viewer JS Library (CE) - Add a Button to a Table or List

Overview

Buttons can be added to a Table or List in the configuration options of Data Viewer.

The "render" object can be used to add a button to a cell.  The value of the render object must be a function which returns HTML representing the button.

Three parameters are available to the function.  The first parameter (data) contains the individual Bridge Attribute value from each record returned.  The third parameter (record) contains all values from the record as an object.  Both parameters can be used to help create the button.

Example

The example below shows an example "data" object for configuration options in Data Viewer.  The button is created with an email address as the text of the button.

NOTE: The class of "control" is used to prevent triggering the row selection.  Without this class, clicking the checkbox will trigger the row selection.

        data: [
            { 
                name: "First Name",
                title:"FIRST",
                class: "",
                setField:"First Name",
            },
            { 
                name: "Last Name",
                title:"Last",
                class: "",
                setField:"Last Name",
            },
            { 
              title:"Button",
              name: "Email",
              class: "control",
              render: function ( data, type, record ) {
                  return "<button>("+record['First Name'] + " " + record['Last Name'] + ") "+ data+ "</button>";
              },
            },
        ],