Добавить пользовательскую кнопку в коллекцию кнопок

Question

Я хочу добавить пользовательскую кнопку в .buttons-collection . См. Снимок экрана и пример ниже.

buttons: [{extend : 'collection',
                         text : '<i class="fa fa-bars"></i>',
                         buttons : [ 'copy', 'csv', 'excel', 'pdf', 'print']}]

Кнопка должна называться «Сообщить о проблеме». При нажатии на кнопку он должен запустить JS ниже (с именем таблицы). Этот код отправляет электронное письмо с описанием проблемы (проблема, связанная с таблицей) -

   onclick=JS("function() {
$(location).attr('href', 'mailto:xxx.com?subject='
              + encodeURIComponent('Issue on Table' + this.table.name)
              + '&body=' 
              + encodeURIComponent('Please check issue on table ' + '\"' + this.table.name + '\"'));
    }

Answer 1

Если у вас есть <table> с идентификатором myTable и именем Your Name Here (просто в качестве заполнителя), вы можете использовать следующее:

$(document).ready(function() {

  $('#myTable').DataTable( {
    dom: 'Bfrtip',
    buttons: [
      { extend : 'collection',
        text : '<i class="fa fa-bars">buttons</i>',
        buttons: [
          'copy', 'csv', 'excel', 'pdf', 'print',
          {
            text: 'Report Issue',
            action: function ( e, dt, node, config ) {
              reportIssue(e, dt, node, config);
            }
          }
        ]
      }]
  } );

  // e - the button click event
  // dt - the datatable object
  // node - button node
  // config - the button's config (e.g. 'text')
  function reportIssue(e, dt, node, config) {    
    var tableName = $('#myTable').attr('name');
    alert( 'The "' + config.text + '" button was clicked\n' 
        + 'for the "' + tableName + '" table.' );
  }

});

Сердце Решением является эта часть, где пользовательская кнопка объявляется:

{
  text: 'Report Issue',
  action: function ( e, dt, node, config ) {
    reportIssue(e, dt, node, config);
  }
}

Примечания:

Я добавил слово «кнопки» к главной кнопке, просто чтобы она не была пустой:

Когда вы нажимаете на это, вы видите следующий набор кнопок:

После этого вам решать, что вы добавите в функцию reportIssue(). Вам может не понадобиться ни одна из переменных, переданных ему. Вероятно, нет, основываясь на примере JS в вопросе (я использовал предупреждение, только для тестирования).