Tabulator: How about php-Code in table

[sourrounder]

Hello,

i would like to open a new browser window oder go to window with given parameters/variables with the call-back-funktion:
rowClick:function(e, row){
alert("Row " + row.getIndex() + " Clicked!!!!")
},

I'd hope to get a link like:
http://localhost:/test/test.php?idnumber=12345&name=peter

When i use regular bootstrap buttons, i get something like:
Go
in the tabulator table.

So what can i do. Tried for hours ...

[sourrounder]

Still trying,
instead of the alert box, i would like to open a (new) browser page with $_GET or $_POST from getIndex() of the call-back-function.

Enough for today, probably it's to simple to see rigt now.

Help appriciated.

[lgraziani2712]

Hello @sourrounder!

If I understand, you want to have a button that opens a new tab with the row's data, right?

You can do something like this example: http://tabulator.info/examples/3.4?#formatters

$("#your-table-id").tabulator({
  // your configuration props
  columns: [
    // your columns
    {
      width: 40, // optional
      align: "center", // optional
      // This callback will format the cell (optional)
      formatter(cell, formatterParams) {
        // fa-print is the printer icon. See more here https://fontawesome.com/icons?d=gallery
        return "<i class='fa fa-print'></i>";
      },
      // This callback will open the new windows
      cellClick(e, cell) {
        const data = cell.getData();
        const params = jQuery.param(data);

        window.open(`test.php?${params}`, '_blank');
      },
    },
  ],
});

Hope it works,

Luciano.

[sourrounder]

Thanks a lot. That's exactly what i'm looking for.
But sorry, your code does not work for me.
With const data and const params i get no click result. Without i get a new tab, but without params.

My code looks like:
$("#my-table").tabulator({
// height:205, // set height of table, this enables the Virtual DOM and improves render speed dramatically (can be any valid css height value)
// layout:"fitColumns", //fit columns to width of table (optional)
pagination:"local", //enable local pagination.
paginationSize:10, // this option can take any positive integer value (default = 10)

//index: "RecPosKlassTxt",
index: ... my index ...
layout:"fitDataFill",
columns:[
... my columns ...
],

rowClick:function(e, row){ //trigger an alert message when the row is clicked
    //alert("Row " + row.getData().IdentNr + " Clicked!!!!"); // ==> THIS WORKS AS ALERT

window.open('test.php?' + row.getData().IdentNr, '_blank');
},
});

==> this results in: test.php?undefined

Happy weekend, i'm getting crazy.

[lgraziani2712]

Can you wrap you code inside code comments?:

+ ```js
+ // Your code
+ ```

Without the +. https://guides.github.com/features/mastering-markdown/#GitHub-flavored-markdown

By the way, you couldn't use jQuery.param function?. It's available since v1.2: http://api.jquery.com/jquery.param/

It makes easier to stringify an object like query params. E.g.:

jQuery.param(row.getData())

So you now can do something like this:

window.open('test.php?' + jQuery.param(row.getData()), '_blank');

Happy weekend for you too!

Luciano.

[sourrounder]

Thanks again,
at least i got it to work, even on an early saturday morning.

Your
window.open('test.php?' + jQuery.param(row.getData()), '_blank');

worked fine, but too many data for an URL. I don't know why, but
const data = cell.getData();
const params = jQuery.param(data);
window.open('test.php?${params}', '_blank');

did not work at all.

BUT:
window.open('test.php?' + row.getData().identNr, '_blank');
rules!

Yesterday it ended in: test.php?undefined

No wonder, i missmatched the identNr with IdentNr. This careless mistake stole me hours.

Thanks, now i'm happy!

[lgraziani2712]

I'm happy you could make it work! Great!

By the way,

window.open('test.php?${params}', '_blank');

It doesn't work because it's a string, the entire content is a string. Instead, of you use back sticks to surround your string, the ${insertVariableOrExpression} is treated as a JS expression. Eg:

window.open(`test.php?${params}`, '_blank');

The name of this characteristic is template string