Ben Kim
Ben Kim

Reputation: 21

Tabulator Selectable and rowSelection column definition

I am using Tabulator and want to allow the end-user to only select one row. I used the Selectable:1 property without issue. However, visually I want to show the user which row since the current select row highlight is insufficient, so I decided to see if I could add a checkmark to confirm that a specific row is indeed selected. Reviewing the documentation shows a formatter called "rowSelection". I added this and it works. However, the header of the rowSelection column has a checkbox (assuming for select all/deselect all), which is enabled. Is there any way to disable this since the end user can only select one row in this case? The workflow is that the user selects a table row and clicks on the View Only, Update or Delete buttons already in place outside of Tabulator.

columns:[   // define the table columns
    {formatter:"rowSelection", titleFormatter:"rowSelection", align:"center", headerSort:false},
    {title:"Period", field:"submissionPeriod"},
    //...
],

Screen Shot

And just an FYI, the header Checkmark is not Center aligned (it is left aligned).

Upvotes: 0

Views: 2567

Answers (1)

Oli Folkerd
Oli Folkerd

Reputation: 8348

If you don't want the checkbox in the column header, the you don't need to specify the titleFormatter in the column constructor:

{formatter:"rowSelection", align:"center", headerSort:false},

Upvotes: 3

Related Questions