Selecting items

Home > Basic examples > Example 04

Explanation

Items can be selected by clicking with the mouse or using the arrow keys.

You can also use a function on a script rather than a user action to change a particular item to a selected state.

var dx = dx5.get("component-id");

// Changing all items to selected state(The order of all items starts from 0.) 
dx.selectAll();

// Changing all items to unselected state. 
dx.unselectAll();

// Changing the 6th item to the selected state. 
dx.selectByIndex(5);

// Changing the 6th item to the unselected state. 
dx.unselectByIndex(5);

// Returns whether to select the 6th item.
if (dx.isSelectedByIndex(5) == true) alert("Selected.");

For full selection and cancellation, the dx5.create function can automatically bind using the btnSelectAll, btnUnselectAll properties.

<button id="btn-select-all">Select all</button>
<button id="btn-unselect-all">Cancel all</button>
<script>
	dx5.create({
		...
		// Linking buttons 
		btnSelectAll: "btn-select-all", btnUnselectAll: "btn-unselect-all"
	});
</script>

Example