How can I resolve the conflict between "language" and "buttons"?

How can I resolve the conflict between "language" and "buttons"?

lincolncartaxolincolncartaxo Posts: 2Questions: 1Answers: 0
<script>
  $(document).ready( function () {
    $('#datatable').DataTable({

  "language": {"url": "//cdn.datatables.net/plug-ins/1.13.6/i18n/pt-BR.json"},
  "buttons": ["copy", "csv", "excel", "pdf", "print", "colvis"]

    }).buttons().container().appendTo(' #datatable_wrapper .col-md-6:eq(0)');
  } );
</script>

This question has an accepted answers - jump to answer

Answers

  • colincolin Posts: 15,095Questions: 1Answers: 2,581

    Please can you provide more information on the issue you want support with - for example, what kind of conflict are you seeing?

    We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

    Cheers,

    Colin

  • allanallan Posts: 61,041Questions: 1Answers: 9,955 Site admin
    Answer ✓

    I can actually what the issue is - per language.url:

    Note that when this parameter is set, DataTables' initialisation will be asynchronous due to the Ajax data load. That is to say that the table will not be drawn until the Ajax request has completed. As such, any actions that require the table to have completed its initialisation should be placed into the initComplete callback.

    So you need to do:

    $(document).ready(function () {
      $("#datatable").DataTable({
        language: { url: "//cdn.datatables.net/plug-ins/1.13.6/i18n/pt-BR.json" },
        buttons: ["copy", "csv", "excel", "pdf", "print", "colvis"],
        initComplete: function () {
          this.api()
            .buttons()
            .container()
            .appendTo(" #datatable_wrapper .col-md-6:eq(0)");
        },
      });
    });
    

    With DataTables 2 you'll be able to do:

      $("#datatable").DataTable({
        language: { url: "//cdn.datatables.net/plug-ins/1.13.6/i18n/pt-BR.json" },
        layout: {
          topStart: {
            buttons: ["copy", "csv", "excel", "pdf", "print", "colvis"],
          },
        },
      });
    

    Allan

  • lincolncartaxolincolncartaxo Posts: 2Questions: 1Answers: 0

    Thank you so much!

Sign In or Register to comment.