Skip to content

NEW > 2022/07/29

TV / Toolbar / Add Dropdown Button

Now you can add a Dropdown-Button, opening a menu of more Links or Buttons.

The dropdown itself can be added by using the AppGiniHelper.TV.addDropdown() -method. That method returns a dropdown-object, for example var dd = AppGiniHelper.TV.addDropdown("flash", "More...");

Menu items (Links or Buttons) can be added to that dropdown by using .addLink(...) or .addButton(...) -method on the dropdown object, for example dd.addLink("#", "cog", "Test);

Example

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
// file: hooks/TABLENAME-tv.js

// in TV it is important to wait for document.ready event
$j(document).ready(function() {

    // add a dropdown button
    var dd = AppGiniHelper.TV.addDropdown("flash", "More...");
    // parameters: Icon, Text

    // add a link to the dropdown menu.
    // Note the placeholder %ID% which will be replaced at runtime per row
    dd.addLink("partners_view.php?SelectedID=%ID%", "user", "Open Partners Table");
    // parameters: URL, Icon, Text

    // add a button, executing a custom javascript function on click
    // note the two parameters 
    //   1. pk (primary key of the row AKA 'id') 
    //   2. data (available values of that row)
    dd.addButton(function(pk, data) {
        console.log(pk);
        console.log(data);
    }, "cog", "Custom function call");
    // parameters: function, Icon, Text

    // ...
    // you can add more links/buttons here
    // ...

    // IMPORTANT last step
    // after you have configured the dropdown button itself AND all contained items (Links/buttons)
    // don't forget to render the dropdown
    dd.render();

});

Parameters

TV.addDropdown

  1. icon (string)
  2. text - button caption (string, optional)
  1. href (string)
  2. icon (string)
  3. text (string, optional)

addButton

  1. callback (function)
  2. icon (string)
  3. text (string, optional)