KX Dashboard - Data Grid - Actions - Is it possible to call Java script code with selected value?

[RV]

When I double click / click on a data grid I am able to trigger open URL. Is it possible to call Java script code with selected value from the data grid?

I am trying to pass the selected value from the data grid to an external application. 

[LeahS]

Great question RV! Thanks for sharing with the community. 🙌

We're working on feedback for you and I'll revert back asap. 

[LeahS · Accepted solution]

Hello RV,

Reverting with feedback for you. 

Please find attached the JPG File with a demo on how to do this. 

In your data grid:

1. Add an action

2. Set the action type to "Run Query"

3. Set the Datasource property, set the query editor, set the type to "Virtual" and set the 1st parameter as a viewstate.  

And here is the javascript.xml

<ui>
	<name>027f3462-2f80-1cab-d100-940a140170a9</name>
	<displayName>run javascript</displayName>
	<description>{
  "creationDate": "Tue, 16 Nov 2021 17:28:40 GMT",
  "lastUpdateDate": "Tue, 16 Nov 2021 17:43:11 GMT",
  "tags": []
}</description>
	<data>{
  "id": "027f3462-2f80-1cab-d100-940a140170a9",
  "name": "run javascript",
  "creationDate": "Tue, 16 Nov 2021 17:28:40 GMT",
  "lastUpdateDate": "Tue, 16 Nov 2021 17:43:11 GMT",
  "thumb": null,
  "screenDetails": [
    {
      "label": "Screen 1",
      "value": "c6f806d4-7510-0675-d8cf-c29aa2545da2"
    }
  ],
  "screens": [
    {
      "id": "c6f806d4-7510-0675-d8cf-c29aa2545da2",
      "name": "Screen 1",
      "thumb": null,
      "widgets": [
        {
          "id": "c027a14d-3a3c-a89c-9d17-5edeb9d45ef5",
          "layout": {
            "row": 0,
            "column": 0,
            "rowSpan": 21,
            "colSpan": 19
          },
          "component": {
            "id": "55bf3782-28a5-65ee-c3f5-dca3a5fbdd18",
            "key": "Datagrid",
            "options": {
              "version": "4.7.0",
              "datagridPossibleColumns": [
                "id",
                "col1",
                "col2"
              ],
              "datagridPossibleColumnsWithItself": [
                "&lt;this&gt;",
                "id",
                "col1",
                "col2"
              ],
              "selectedColumnPossibleValues": [
                "id",
                "col1",
                "col2"
              ],
              "highlightTargetPossibleValues": [
                "id",
                "col1",
                "col2",
                "*"
              ],
              "sortingPossibleValues": [
                "",
                "id",
                "col1",
                "col2"
              ],
              "Basics": {
                "Data": {
                  "_dashboardsType": "data",
                  "value": "data"
                }
              },
              "ColumnsConfiguration": [
                {
                  "Field": "id",
                  "DisplayName": "id",
                  "Format": "Formatted Number",
                  "Precision": 0,
                  "WidthWeight": 165,
                  "MinWidthAbsolute": 165,
                  "TextAlign": "right"
                },
                {
                  "Field": "col1",
                  "DisplayName": "col1",
                  "Format": "Formatted Number",
                  "Precision": 0,
                  "WidthWeight": 165,
                  "MinWidthAbsolute": 165,
                  "TextAlign": "right"
                },
                {
                  "Field": "col2",
                  "DisplayName": "col2",
                  "Format": "Formatted Number",
                  "Precision": 0,
                  "WidthWeight": 165,
                  "MinWidthAbsolute": 165,
                  "TextAlign": "right"
                }
              ],
              "Selection": {
                "RowSelectionColumn": "id",
                "Actions": {
                  "0": {
                    "DataSource": {
                      "_dashboardsType": "data",
                      "value": "runQuery"
                    },
                    "_Type": "query",
                    "TriggerColumn": "*",
                    "Trigger": "Click"
                  }
                },
                "Mode": "Single Row",
                "SelectedValue": {
                  "_dashboardsType": "viewstate",
                  "value": "selected"
                }
              },
              "Alignment": {
                "paddingLeft": 0,
                "paddingRight": 0,
                "paddingTop": 0,
                "paddingBottom": 0,
                "innerPaddingLeft": 0,
                "innerPaddingRight": 0,
                "innerPaddingTop": 0,
                "innerPaddingBottom": 0,
                "titlePaddingLeft": 0,
                "titlePaddingRight": 0
              },
              "format": {
                "tileBorderWidth": 0,
                "tileBorderRounding": 0,
                "tileBorderColor": "#000000",
                "tileBackgroundColor": "#000000",
                "tileTransparentBackground": true,
                "tileShadow": false
              }
            },
            "containerId": null,
            "components": [],
            "widgets": [],
            "definitionId": "21",
            "hasOnSettingsChange": true
          }
        }
      ],
      "relativeHeight": true,
      "rowCount": 24,
      "rowHeight": 25,
      "colCount": 36,
      "floatable": true,
      "isDefault": true
    }
  ],
  "popups": [],
  "tags": [],
  "dashboardTheme": "Dark",
  "themeSwitchable": true,
  "saveTimestamp": null,
  "relativeHeight": true,
  "rowCount": 24,
  "rowHeight": 25,
  "colCount": 36,
  "floatable": true,
  "viewState": {
    "selected": {
      "_viewType": true,
      "_default": "",
      "_type": "symbol"
    },
    ".settings": {}
  },
  "data": {
    "data": {
      "_pagingType": "NONE",
      "_autoExecute": true,
      "_autoExec": true,
      "_columns": [
        "id",
        "col1",
        "col2"
      ],
      "_dataType": "query",
      "_dataSource": "kdb",
      "_connection": "html5evalcongroup",
      "_mappings": {
        "key": "id",
        "mappings": {},
        "value": "col1"
      },
      "_maxRows": 2000,
      "_subscriptionType": "static",
      "_subscriptionInterval": 3,
      "_layout": [
        {
          "isExpanded": true,
          "weight": 2
        },
        {
          "isExpanded": false,
          "weight": 1
        },
        {
          "isExpanded": false,
          "weight": 1
        },
        {
          "isExpanded": true,
          "weight": 1
        },
        {
          "isExpanded": true,
          "weight": 2
        }
      ],
      "_queryString": "([]\r\n  id:1 + 1 * til 20;\r\n  col1:20?10;\r\n  col2:20?10)",
      "_queryParams": [],
      "_subscriptionKey": "",
      "_hasUpdateQuery": false,
      "_updateQueryParams": [],
      "_updateQueryString": "",
      "_updateType": "query",
      "_pageSize": 2000,
      "_serverPaging": false
    },
    "runQuery": {
      "_autoExec": true,
      "_autoExecute": true,
      "_columns": [],
      "_dataType": "virtual",
      "_dataSource": "kdb",
      "_connection": "html5evalcongroup",
      "_mappings": {},
      "_maxRows": 2000,
      "_subscriptionType": "static",
      "_subscriptionInterval": 3,
      "_layout": [
        {
          "isExpanded": true,
          "weight": 2.5159010600706715
        },
        {
          "isExpanded": false,
          "weight": 1
        },
        {
          "isExpanded": false,
          "weight": 1
        },
        {
          "isExpanded": true,
          "weight": 0
        },
        {
          "isExpanded": true,
          "weight": 1.4840989399293287
        }
      ],
      "_subscriptionKey": "",
      "_virtualParams": [
        {
          "name": "viewstate",
          "index": 0,
          "type": "viewstate",
          "value": "selected"
        }
      ],
      "_virtualQueryString": "function (viewstate, callback) {\n\n    // javascript goes here\n    // e.g\n    window.open(\"https://www.google.com/search?q=\"+ viewstate,\"_blank\");\n    callback({meta:{}, cols:[], rows:{}});\n\n}"
    }
  },
  "permissionEntity": {
    "class": "api.entity.PermissionEntity",
    "permissions": {
      "DeltaMonAdmin": [
        false,
        false
      ],
      "all": [
        false,
        false
      ],
      "PowerUser": [
        false,
        false
      ],
      "BSU": [
        false,
        false
      ],
      "ActionTrackerAdmins": [
        false,
        false
      ],
      "DeltaMonUsers": [
        false,
        false
      ],
      "Analyst": [
        false,
        false
      ],
      "ActionTrackerUsers": [
        false,
        false
      ],
      "Administrators": [
        true,
        true
      ],
      "DashboardUsers": [
        false,
        false
      ],
      "BSUManagers": [
        false,
        false
      ],
      "DeltaDocGenRestrictions": [
        false,
        false
      ],
      "ReportAdminUserGroup": [
        false,
        false
      ]
    }
  },
  "worksheetPadding": 10,
  "widgetsSpacing": 0,
  "borderColor": "000000",
  "borderBackground": "000000",
  "transparentBackground": true,
  "borderWidth": 0,
  "borderRounding": 0,
  "borderSpacing": 0,
  "borderShadow": false,
  "saveViewerState": "enabled",
  "enableShareDashboard": false,
  "notifications": null,
  "showLoadingIndicators": true,
  "unsavedViewerPrompt": false,
  "advancedCss": "",
  "cssClasses": "",
  "version": "4.6.0P1",
  "wasChanged": false
}</data>
</ui>

I hope this is helpful for you.

Kind regards,

Leah 

[RV]

Thank You so much !! 👍