Index

  1. Home
  2. Docs
  3. Index
  4. Data Publisher
  5. Custom buttons [Premium]

Custom buttons [Premium]

Option wpda_buttons_custom allows plugin users to add multiple custom buttons their publications.

Example

{
	"wpda_buttons_custom": [
		{
			"text": "My Function",
			"action": "function ( e, dt, node, config ) { my_function(); }"
		},
		{
			"text": "Print selected rows",
			"extend": "print"
		},
		{
			"text": "Print selected rows and columns",
			"extend": "copy",
			"exportOptions": {
				"columns": ":visible"
			}
		}
	]
}

Use custom buttons to redefined standard buttons (see print buttons examples) to:

  • Change the button label
  • Change button behaviour

Add your own javascript functions to a custom button (see My Function example). More information about this topic can be found here:

» jQuery DataTables custom buttons

A WP Data Access example can be found here:

» Code Manager custom button example

Use the Code Manager to add your javascript function to your web page:

» Add a javascript function with the Code Manager

Button labels

Button labels are show in uppercase by default. You can change this in your css.

.dt-button {
    text-transform: inherit;
}

Note

  • Custom buttons are shown in the order they are added to the custom button array and before standard buttons
Was this article helpful to you? Yes No

2 Replies to “Custom buttons [Premium]”

    1. Yes, that one is tricky! 🙂

      It took my half a day to get that working. The problem is that the button is created after the data table. So document ready is too early. I fixed it by adding a titleAttr attribute and an initComplete event to my publication options, like this:

      “wpda_buttons_custom”: [
      {
      “text”: “Download selected code”,
      “className”: “cm_button_download”,
      “action”: “function ( e, dt, node, config ) { code_manager_export(); }”,
      “titleAttr”: “Click row to select or deselect (multiple row selection supported)”
      }
      ],
      “initComplete”: “function(settings, json) { jQuery(‘.cm_button_download’).tooltip(); }”

      You just need to change the button and jQuery selector! 😉

      Hope this helps,
      Peter

Leave a Reply

Your email address will not be published. Required fields are marked *

ten + sixteen =