Perspective Table - How to copy cell value with enableColumnSelection disabled

Hello guys,

in a Perspective Table, I enabled the enableRowSelection property to read the data of the entire row from the selection -> data property.

However, the end users requested the ability to copy the content of a single cell. The only straightforward way I found to do this was by enabling the enableColumnSelection property.

Obviously, by doing so, I lose the data of the entire row in the selection -> data property.

How can I manage both requirements at the same time?

Thanks for the help

Try this table setup.

I've used something similar in the past but don't have access anymore, so I whipped this up quick. Note the binding on the table data, custom property for selectionData and the Change Script on props.selection.selectedRow.

Have to log off for today, so good luck with it.

Table Component with Row Selection and Copyable Cells
[
  {
    "type": "ia.display.table",
    "version": 0,
    "props": {
      "selection": {
        "enableColumnSelection": true,
        "selectedColumn": "country",
        "selectedRow": 2,
        "data": [
          {
            "country": "Indonesia"
          }
        ]
      }
    },
    "meta": {
      "name": "Table"
    },
    "position": {
      "x": 726,
      "y": 66,
      "width": 400,
      "height": 400
    },
    "custom": {},
    "propConfig": {
      "custom.selectionData": {
        "binding": {
          "type": "expr",
          "config": {
            "expression": "{this.props.data}[{this.props.selection.selectedRow}]['value']"
          }
        }
      },
      "props.selection.selectedRow": {
        "onChange": {
          "script": "\tif previousValue and previousValue.value is not None:\n\t\tself.props.data[previousValue.value]['style']['backgroundColor'] = 'var(--neutral-10)' if previousValue.value % 2 == 0 else 'var(--neutral-20)'\n\tself.props.data[currentValue.value]['style']['backgroundColor'] = 'rgba(12, 123, 179, 0.25)'",
          "enabled": null
        }
      },
      "props.data": {
        "binding": {
          "type": "expr",
          "config": {
            "expression": "1"
          },
          "transforms": [
            {
              "code": "\tdata = [\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"United States\",\n\t      \"city\": {\n\t        \"style\": {\n\t          \"backgroundColor\": \"#F7901D\",\n\t          \"classes\": \"some-class\"\n\t        },\n\t        \"align\": \"center\",\n\t        \"value\": \"Folsom\",\n\t        \"editable\": True,\n\t        \"justify\": \"left\"\n\t      },\n\t      \"population\": 77271\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Finland\",\n\t      \"city\": \"Helsinki\",\n\t      \"population\": 635591\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Indonesia\",\n\t      \"city\": \"Jakarta\",\n\t      \"population\": 10187595\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Spain\",\n\t      \"city\": \"Madrid\",\n\t      \"population\": 3233527\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Czech Republic\",\n\t      \"city\": \"Prague\",\n\t      \"population\": 1241664\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"United States\",\n\t      \"city\": \"San Diego\",\n\t      \"population\": 1406630\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"rgba(12, 123, 179, 0.25)\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"United States\",\n\t      \"city\": \"San Francisco\",\n\t      \"population\": 884363\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"China\",\n\t      \"city\": \"Shanghai\",\n\t      \"population\": 24153000\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Japan\",\n\t      \"city\": \"Tokyo\",\n\t      \"population\": 13617000\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"United States\",\n\t      \"city\": \"Washington, DC\",\n\t      \"population\": 658893\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"New Zealand\",\n\t      \"city\": \"Wellington\",\n\t      \"population\": 405000\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"India\",\n\t      \"city\": \"Delhi\",\n\t      \"population\": 11034555\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Bangladesh\",\n\t      \"city\": \"Dhaka\",\n\t      \"population\": 14399000\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Nigeria\",\n\t      \"city\": \"Lagos\",\n\t      \"population\": 16060303\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Pakistan\",\n\t      \"city\": \"Karachi\",\n\t      \"population\": 14910352\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Turkey\",\n\t      \"city\": \"Istanbul\",\n\t      \"population\": 14025000\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Egypt\",\n\t      \"city\": \"Cairo\",\n\t      \"population\": 10230350\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Mexico\",\n\t      \"city\": \"Mexico City\",\n\t      \"population\": 8974724\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"United Kingdom\",\n\t      \"city\": \"London\",\n\t      \"population\": 8825001\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"United States\",\n\t      \"city\": \"New York City\",\n\t      \"population\": 8622698\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Iran\",\n\t      \"city\": \"Tehran\",\n\t      \"population\": 8154051\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Colombia\",\n\t      \"city\": \"Bogota\",\n\t      \"population\": 7878783\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Brazil\",\n\t      \"city\": \"Rio de Janeiro\",\n\t      \"population\": 6429923\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Saudi Arabia\",\n\t      \"city\": \"Riyadh\",\n\t      \"population\": 5676621\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Singapore\",\n\t      \"city\": \"Singapore\",\n\t      \"population\": 5535000\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Russia\",\n\t      \"city\": \"Saint Petersburg\",\n\t      \"population\": 5191690\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Australia\",\n\t      \"city\": \"Sydney\",\n\t      \"population\": 208374\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Ivory Coast\",\n\t      \"city\": \"Abidjan\",\n\t      \"population\": 4765000\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Tanzania\",\n\t      \"city\": \"Dar es Salaam\",\n\t      \"population\": 4364541\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"New Zealand\",\n\t      \"city\": \"Wellington\",\n\t      \"population\": 405000\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"United States\",\n\t      \"city\": \"Los Angeles\",\n\t      \"population\": 3884307\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Germany\",\n\t      \"city\": \"Berlin\",\n\t      \"population\": 3517424\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Saudi Arabia\",\n\t      \"city\": \"Jeddah\",\n\t      \"population\": 3456259\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Afghanistan\",\n\t      \"city\": \"Kabul\",\n\t      \"population\": 3414100\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Iran\",\n\t      \"city\": \"Mashhad\",\n\t      \"population\": 3001184\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Italy\",\n\t      \"city\": \"Milan\",\n\t      \"population\": 1359905\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Ukraine\",\n\t      \"city\": \"Kiev\",\n\t      \"population\": 2908703\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Italy\",\n\t      \"city\": \"Rome\",\n\t      \"population\": 2877215\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"United States\",\n\t      \"city\": \"Chicago\",\n\t      \"population\": 2695598\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Japan\",\n\t      \"city\": \"Osaka\",\n\t      \"population\": 2691742\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Indonesia\",\n\t      \"city\": \"Bandung\",\n\t      \"population\": 2575478\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Nicaragua\",\n\t      \"city\": \"Managua\",\n\t      \"population\": 2560789\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"France\",\n\t      \"city\": \"Paris\",\n\t      \"population\": 2229621\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Iran\",\n\t      \"city\": \"Shiraz\",\n\t      \"population\": 1869001\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Philippines\",\n\t      \"city\": \"Manila\",\n\t      \"population\": 1780148\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Canada\",\n\t      \"city\": \"Montreal\",\n\t      \"population\": 1649519\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Mexico\",\n\t      \"city\": \"Guadalajara\",\n\t      \"population\": 1495189\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"United States\",\n\t      \"city\": \"Dallas\",\n\t      \"population\": 1317929\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Armenia\",\n\t      \"city\": \"Yerevan\",\n\t      \"population\": 1060138\n\t    }\n\t  },\n\t  {\n\t    \"style\": {\n\t      \"backgroundColor\": \"inherit\",\n\t      \"classes\": \"\"\n\t    },\n\t    \"value\": {\n\t      \"country\": \"Tunisia\",\n\t      \"city\": \"Tunis\",\n\t      \"population\": 1056247\n\t    }\n\t  }\n\t]\n\t\n\tretval = []\n\tcount = 0\n\tfor x in data:\n\t\tx['style']['backgroundColor'] = 'var(--neutral-10)' if count % 2 == 0 else 'var(--neutral-20)'\n\t\tretval.append(x)\n\t\tcount += 1\n\t\n\treturn retval",
              "type": "script"
            }
          ]
        }
      }
    }
  }
]
1 Like

Thanks for the help, I'll try it!