Блог

Это в C # ASP.NET Веб-приложение MVC 5, использующее таблицы данных версии 1.10.22.

Я настраиваю DataTable на наличие пользовательской кнопки. Действие для кнопки — это функция обратного вызова. После того, как эта функция будет выполнена один раз, я хочу отключить кнопку.

Я могу отключить все кнопки, связанные с таблицей данных. Но как мне отключить только одну кнопку?

Документация по таблицам данных, такая как https://datatables.net/reference/api/buttons ().disable(), есть пример, который, кажется, идентифицирует определенные кнопки по … их имени класса CSS?

 var table = $('#myTable').DataTable();
var buttons = table.buttons( ['.edit', '.delete'] );
buttons.disable();
 

Но как мне однозначно идентифицировать мою пользовательскую кнопку?

Функция обратного вызова действия для кнопки, похоже, снабжена несколькими параметрами, которые представляют кнопку. Но, node похоже, у нее нет disable() функции. Изменение config.enabled на false не имеет никакого эффекта. Что еще я могу попробовать?

Следующее, что я пытаюсь сделать в моих Views/Foo/Index.cshtml:

 <script>
  $( document ).ready( onReady );



  function onReady()
  {
    var config = {};

    config.buttons =
    [
      // A button to create data for the table.
      {
        text: '<span class="fa fa-plus"/>',
        titleAttr: 'Create states',
        action: createStates,
        enabled: true,
      }

      ... other buttons ...
    ];

    ... other configuration ...

    $( '#state-table' ).DataTable( config ) );
  }



  /**
   * Create the states.
   * 
   * Parameters:
   * e (object): The event.
   * table (object): The DataTable.
   * node (jQuery): The jQuery instance of the button that was clicked.
   * config (object): The button configuration.
   */
  function createStates( e, table, node, config )
  {
    //------------------------------
    // Create client-side state data in the table.
    table.clear();

    for ( var i = 0; i < 3; i   )
    {
      var data = { Id: i, Name: 'state '   i };
      table.row.add( data );
    }

    //------------------------------
    // Calling draw() at the end updates the DataTable internal caches.
    table.rows().draw();

    //------------------------------
    // Disable the button, so that states cannot be created again.
    // *** How ? ***

    // Just changing this property has no effect on the button.
    config.enabled = false;

    // This disables all buttons, not just the one I want.
    table.buttons().disable();
  }
</script>
 

Каждой кнопке DataTables может быть присвоено имя кнопки и / или имя класса, а затем вы можете ссылаться на эту кнопку, используя любой из них — например:

 $(document).ready(function() {

  var table = $('#myTable').DataTable( {
    dom: 'Bfrtip',
    "buttons": [
      {
        text: 'My Button',
        className: 'myButtonClass',
        name: 'myButtonName'
      }
    ]
  } );

  table.buttons( '.myButtonClass' ).disable();
  //table.buttons( 'myButtonName:name' ).disable();

});
 

В приведенном выше примере кнопка имеет как имя кнопки, так и имя класса.

Существуют различные дополнительные способы выбора одной или нескольких кнопок:

 buttons( selector );
 

Эти selector параметры описаны здесь .

И, да, этот пример в вашем вопросе…

 var buttons = table.buttons( ['.edit', '.delete'] );
 

… действительно ли используется селектор имени класса.