{hero}

buttons.buttons.titleAttr

Since: Buttons 3.0.0

Button title attribute text.
Please note - this property requires the Buttons extension for DataTables.

Description

This option provides the ability to set the title attribute for the button. This can be used to provide a detailed description of the button, or a simple text name if you choose to display an icon in the button rather than text (using the buttons.buttons.text option).

Browser's will show the text given in the title attribute in a tooltip that will be displayed when the user hovers their mouse over the button, and accessibility software such as screen readers can use it to better inform users what a button does.

Types

string

Description:

A plain text string that will be set as the title attribute for the button. Browsers will display this text when the mouse is hovered over the button and screen readers can use it to improve accessibility.

function titleAttr( dt, node, config )

Description:

The buttons.buttons.titleAttr buttons option can be defined as a function that will be executed when Buttons requires the text for the button's title attribute. This provides the ability for plug-in authors to make use of i18n() to easily provide internationalisation support for the text shown in buttons. It could also potentially be used for other complex interactions.

Parameters:
Returns:

The string to be displayed for the buttons visual text

Default

  • Value: No default value (i.e. undefined)

Example

Copy button with a Font Awesome icon and title text:

new DataTable('#myTable', {
	layout: {
		topEnd: {
			buttons: [
				{
					extend: 'copyHtml5',
					text: '<i class="fa fa-files-o"></i>',
					titleAttr: 'Copy'
				}
			]
		}
	}
});