How add action button on Vue3 component

How add action button on Vue3 component

joseamontalvojoseamontalvo Posts: 2Questions: 1Answers: 0

Hello everyone.

Can you help me with an example of how to add a button for each row and link it to a VUE event ?.

Thank you very much.

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 56,888Questions: 1Answers: 9,042 Site admin
    Answer ✓

    You can't trigger a Vue event using the standard @myCallback syntax of Vue since the DOM of the table is under DataTables' control, rather than Vue's.

    What you need to do is bind DOM events (jQuery can be used for this as it makes life easy) - e.g. you could:

    let dt;
    const table = ref(); // This variable is used in the `ref` attribute for the component
     
    onMounted(function () {
      let dt = table.value.dt();
    
      $(dt.table().body()).on('click', 'a.myButton', function () {
        // Callback
      });
    });
    

    Use a renderer to create the button if it isn't already in the data you are using to display in the DataTable.

    Allan

  • joseamontalvojoseamontalvo Posts: 2Questions: 1Answers: 0

    Thank you so much!!! Allan.

Sign In or Register to comment.