Get 2024 Templates Mega Bundle!$1000 worth of 19 Bootstrap HTML, Vue & React Templates + 3 Vector Sets for just $99
Get for 99$

Cant get datatables Export buttons to show with laravel app


I used the log/audit page example to create a new page and the datatable shows up fine, but I can not get the export buttons to show.

public function html(): HtmlBuilder
{
return $this->builder()
->setTableId("users-table")
->columns($this->getColumns())
->minifiedAjax()
->stateSave(true)
->orderBy(6)
->responsive()
->autoWidth(false)
->parameters([
"buttons" => ["export"],
])
->buttons([
Button::make("create"),
Button::make("export"),
Button::make("print"),
Button::make("reset"),
]);
}

when I view the console, it shows error of "Uncaught Cannot extend unknown button type: create


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (3)


Hi,

To resolve the issue, you need to modify the DOM configuration in the file located at resources/assets/extended/js/vendors/plugins/datatables.init.js. You need to add "B" to the existing DOM configuration. Here's an example:


dom:
"Bf<"table-responsive"tr>" +
//...


Rebuild the assets using "npm run dev"

For more information on the available plug-ins for the DOM configuration, please refer to the official documentation on the DataTables website: https://datatables.net/reference/option/dom#Plug-ins.

Thanks



I tried your change and yes the error goes away, but there are no buttons that show in the datatable. I have used yajrabox datatables before and the buttons show like they should. its something about this theme that is not working. The examples on the theme dont add buttons, so im not sure whats missing.



Hi,

It seems that the error "Uncaught Cannot extend unknown button type: create" is related to the button type 'create' which is not recognized by the DataTables Buttons extension. To resolve this issue, you can remove the 'create' button type from your buttons list and keep only the export, print, and reset buttons.

You can modify your code like this:


public function html(): HtmlBuilder
{
return $this->builder()
->setTableId("users-table")
->columns($this->getColumns())
->minifiedAjax()
->stateSave(true)
->orderBy(6)
->responsive()
->autoWidth(false)
->buttons([
Button::make("export"),
Button::make("print"),
Button::make("reset"),
])
->parameters([
"buttons" => ["export", "print", "reset"],
]);
}


For more information, please refer to the Laravel Datatables official documentation at the following link: https://yajrabox.com/docs/laravel-datatables/10.0/buttons-export

Thanks


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(