tabulator - how to insert tickCross using javascript - Stack Overflow

admin管理员组

文章数量:1123783

My Tabulator table uses tickCross in one column - I am interested in having javascript turn on the tick mark - actively - using javascript to tick it, without manually pressing the box. I was able to insert it using javascript, however when I save the file to a cvs, it is not included in the file when I reload. Right now I must manually click the checkmark "on" for it to save in the file. Is it possible to activate the tickCross checkmark using javascript (as though I clicked it) and still have it save with the file?

My Tabulator table uses tickCross in one column - I am interested in having javascript turn on the tick mark - actively - using javascript to tick it, without manually pressing the box. I was able to insert it using javascript, however when I save the file to a cvs, it is not included in the file when I reload. Right now I must manually click the checkmark "on" for it to save in the file. Is it possible to activate the tickCross checkmark using javascript (as though I clicked it) and still have it save with the file?

• javascript
• tabulator

Share Improve this question Follow edited yesterday mplungjan 177k2828 gold badges180180 silver badges240240 bronze badges asked yesterday David BanningDavid Banning 1311 silver badge33 bronze badges 2

• Which language are you using (i.e. nodejs, angular, react etc)? Please add some steps or code to understand the problem. – sandeepchhapola Commented yesterday
• @sandeepchhapola tabulator.info/docs/6.3/format – mplungjan Commented yesterday

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

You can use this for multiple

table.updateData([
    { id: "row1" , "example": true }  
]);

or this for one

table.updateCell("row1", "example", true); 

Here is a running example.

const table = new Tabulator("#example-table", {
  height: "311px",
  layout: "fitColumns",
  columns: [
    { title: "ID", field: "id", width: 150 },
    { title: "Example", field: "example", formatter: "tickCross", formatterParams: { allowTruthy: true } 
    }
  ],
  data: [
    { id: "row1", example: false },
    { id: "row2", example: false }
  ]
});


document.getElementById("update-button").addEventListener("click", function() {
  table.updateData([{
    id: 'row1',  // update by id 
    example: true
  }]);
});

<script src="https://unpkg.com/[email protected]/dist/js/tabulator.min.js"></script>

<link href="https://unpkg.com/[email protected]/dist/css/tabulator.min.css" rel="stylesheet">

<h1>Tabulator TickCross Example</h1>
<div id="example-table"></div>
<button id="update-button">Update First Row</button>

本文标签： tabulatorhow to insert tickCross using javascriptStack Overflow