vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Docs for ContextMenu and DataTable

pull/132/head
cagataycivici 2019-12-09 11:34:31 +03:00
parent 1d279b920d
commit 1ff31531e9
10 changed files with 249 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/datatable/DataTable.d.ts vendored
View File

@ -28,6 +28,7 @@ export declare class DataTable extends Vue {
selectionMode?: string;
compareSelectionBy?: string;
metaKeySelection?: boolean;
contextMenuSelection?: any;
rowHover?: boolean;
csvSeparator?: string;
exportFilename?: string;
@ -58,6 +59,7 @@ export declare class DataTable extends Vue {
$emit(eventName: 'sort', event: Event): this;
$emit(eventName: 'filter', event: Event): this;
$emit(eventName: 'row-click', event: Event): this;
$emit(eventName: 'row-contextmenu', event: Event): this;
$emit(eventName: 'row-select', event: Event): this;
$emit(eventName: 'row-unselect', event: Event): this;
$emit(eventName: 'column-resize-end', event: Event): this;

43
src/components/datatable/DataTable.vue
View File

@ -27,11 +27,11 @@
@column-click="onColumnHeaderClick($event)" @column-mousedown="onColumnHeaderMouseDown($event)"
@column-dragstart="onColumnHeaderDragStart($event)" @column-dragover="onColumnHeaderDragOver($event)" @column-dragleave="onColumnHeaderDragLeave($event)" @column-drop="onColumnHeaderDrop($event)"
@column-resizestart="onColumnResizeStart($event)" @checkbox-change="toggleRowsWithCheckbox($event)" />
<DTTableBody :value="dataToRender" :columns="columns" :empty="empty" :dataKey="dataKey" :selection="selection" :selectionKeys="d_selectionKeys" :selectionMode="selectionMode"
<DTTableBody :value="dataToRender" :columns="columns" :empty="empty" :dataKey="dataKey" :selection="selection" :selectionKeys="d_selectionKeys" :selectionMode="selectionMode" :contextMenuSelection="contextMenuSelection"
:rowGroupMode="rowGroupMode" :groupRowsBy="groupRowsBy" :expandableRowGroups="expandableRowGroups" :rowClass="rowClass" :editMode="editMode" :compareSelectionBy="compareSelectionBy"
:expandedRowIcon="expandedRowIcon" :collapsedRowIcon="collapsedRowIcon" :expandedRows="expandedRows" :expandedRowKeys="d_expandedRowKeys" :expandedRowGroups="expandedRowGroups"
:editingRows="editingRows" :editingRowKeys="d_editingRowKeys" :templates="$scopedSlots"
@rowgroup-toggle="toggleRowGroup" @row-click="onRowClick($event)" @row-touchend="onRowTouchEnd" @row-keydown="onRowKeyDown"
@rowgroup-toggle="toggleRowGroup" @row-click="onRowClick($event)" @row-rightclick="onRowRightClick($event)" @row-touchend="onRowTouchEnd" @row-keydown="onRowKeyDown"
@row-mousedown="onRowMouseDown" @row-dragstart="onRowDragStart($event)" @row-dragover="onRowDragOver($event)" @row-dragleave="onRowDragLeave($event)" @row-dragend="onRowDragEnd($event)" @row-drop="onRowDrop($event)"
@row-toggle="toggleRow($event)" @radio-change="toggleRowWithRadio($event)" @checkbox-change="toggleRowWithCheckbox($event)"
@cell-edit-init="onCellEditInit($event)" @cell-edit-complete="onCellEditComplete($event)" @cell-edit-cancel="onCellEditCancel($event)"
@ -50,22 +50,22 @@
@column-resizestart="onColumnResizeStart($event)" @checkbox-change="toggleRowsWithCheckbox($event)" />
</template>
<template #body>
<DTTableBody :value="dataToRender" :columns="frozenColumns" :empty="empty" :dataKey="dataKey" :selection="selection" :selectionKeys="d_selectionKeys" :selectionMode="selectionMode"
<DTTableBody :value="dataToRender" :columns="frozenColumns" :empty="empty" :dataKey="dataKey" :selection="selection" :selectionKeys="d_selectionKeys" :selectionMode="selectionMode" :contextMenuSelection="contextMenuSelection"
:rowGroupMode="rowGroupMode" :groupRowsBy="groupRowsBy" :expandableRowGroups="expandableRowGroups" :rowClass="rowClass" :editMode="editMode" :compareSelectionBy="compareSelectionBy"
:expandedRowIcon="expandedRowIcon" :collapsedRowIcon="collapsedRowIcon" :expandedRows="expandedRows" :expandedRowKeys="d_expandedRowKeys" :expandedRowGroups="expandedRowGroups"
:editingRows="editingRows" :editingRowKeys="d_editingRowKeys" :templates="$scopedSlots"
@rowgroup-toggle="toggleRowGroup" @row-click="onRowClick($event)" @row-touchend="onRowTouchEnd" @row-keydown="onRowKeyDown"
@rowgroup-toggle="toggleRowGroup" @row-click="onRowClick($event)" @row-rightclick="onRowRightClick($event)" @row-touchend="onRowTouchEnd" @row-keydown="onRowKeyDown"
@row-mousedown="onRowMouseDown" @row-dragstart="onRowDragStart($event)" @row-dragover="onRowDragOver($event)" @row-dragleave="onRowDragLeave($event)" @row-dragend="onRowDragEnd($event)" @row-drop="onRowDrop($event)"
@row-toggle="toggleRow($event)" @radio-change="toggleRowWithRadio($event)" @checkbox-change="toggleRowWithCheckbox($event)"
@cell-edit-init="onCellEditInit($event)" @cell-edit-complete="onCellEditComplete($event)" @cell-edit-cancel="onCellEditCancel($event)"
@row-edit-init="onRowEditInit($event)" @row-edit-save="onRowEditSave($event)" @row-edit-cancel="onRowEditCancel($event)"/>
</template>
<template #frozenbody>
<DTTableBody v-if="frozenValue" :value="frozenValue" :columns="frozenColumns" :dataKey="dataKey" :selection="selection" :selectionKeys="d_selectionKeys" :selectionMode="selectionMode"
<DTTableBody v-if="frozenValue" :value="frozenValue" :columns="frozenColumns" :dataKey="dataKey" :selection="selection" :selectionKeys="d_selectionKeys" :selectionMode="selectionMode" :contextMenuSelection="contextMenuSelection"
:rowGroupMode="rowGroupMode" :groupRowsBy="groupRowsBy" :expandableRowGroups="expandableRowGroups" :rowClass="rowClass" :editMode="editMode" :compareSelectionBy="compareSelectionBy"
:expandedRowIcon="expandedRowIcon" :collapsedRowIcon="collapsedRowIcon" :expandedRows="expandedRows" :expandedRowKeys="d_expandedRowKeys" :expandedRowGroups="expandedRowGroups"
:editingRows="editingRows" :editingRowKeys="d_editingRowKeys" :templates="$scopedSlots"
@rowgroup-toggle="toggleRowGroup" @row-click="onRowClick($event)" @row-touchend="onRowTouchEnd" @row-keydown="onRowKeyDown"
@rowgroup-toggle="toggleRowGroup" @row-click="onRowClick($event)" @row-rightclick="onRowRightClick($event)" @row-touchend="onRowTouchEnd" @row-keydown="onRowKeyDown"
@row-mousedown="onRowMouseDown" @row-dragstart="onRowDragStart($event)" @row-dragover="onRowDragOver($event)" @row-dragleave="onRowDragLeave($event)" @row-dragend="onRowDragEnd($event)" @row-drop="onRowDrop($event)"
@row-toggle="toggleRow($event)" @radio-change="toggleRowWithRadio($event)" @checkbox-change="toggleRowWithCheckbox($event)"
@cell-edit-init="onCellEditInit($event)" @cell-edit-complete="onCellEditComplete($event)" @cell-edit-cancel="onCellEditCancel($event)"
@ -86,22 +86,22 @@
@column-resizestart="onColumnResizeStart($event)" @checkbox-change="toggleRowsWithCheckbox($event)" />
</template>
<template #body>
<DTTableBody :value="dataToRender" :columns="scrollableColumns" :empty="empty" :dataKey="dataKey" :selection="selection" :selectionKeys="d_selectionKeys" :selectionMode="selectionMode"
<DTTableBody :value="dataToRender" :columns="scrollableColumns" :empty="empty" :dataKey="dataKey" :selection="selection" :selectionKeys="d_selectionKeys" :selectionMode="selectionMode" :contextMenuSelection="contextMenuSelection"
:rowGroupMode="rowGroupMode" :groupRowsBy="groupRowsBy" :expandableRowGroups="expandableRowGroups" :rowClass="rowClass" :editMode="editMode" :compareSelectionBy="compareSelectionBy"
:expandedRowIcon="expandedRowIcon" :collapsedRowIcon="collapsedRowIcon" :expandedRows="expandedRows" :expandedRowKeys="d_expandedRowKeys" :expandedRowGroups="expandedRowGroups"
:editingRows="editingRows" :editingRowKeys="d_editingRowKeys" :templates="$scopedSlots"
@rowgroup-toggle="toggleRowGroup" @row-click="onRowClick($event)" @row-touchend="onRowTouchEnd" @row-keydown="onRowKeyDown"
@rowgroup-toggle="toggleRowGroup" @row-click="onRowClick($event)" @row-rightclick="onRowRightClick($event)" @row-touchend="onRowTouchEnd" @row-keydown="onRowKeyDown"
@row-mousedown="onRowMouseDown" @row-dragstart="onRowDragStart($event)" @row-dragover="onRowDragOver($event)" @row-dragleave="onRowDragLeave($event)" @row-dragend="onRowDragEnd($event)" @row-drop="onRowDrop($event)"
@row-toggle="toggleRow($event)" @radio-change="toggleRowWithRadio($event)" @checkbox-change="toggleRowWithCheckbox($event)"
@cell-edit-init="onCellEditInit($event)" @cell-edit-complete="onCellEditComplete($event)" @cell-edit-cancel="onCellEditCancel($event)"
@row-edit-init="onRowEditInit($event)" @row-edit-save="onRowEditSave($event)" @row-edit-cancel="onRowEditCancel($event)"/>
</template>
<template #frozenbody>
<DTTableBody v-if="frozenValue" :value="frozenValue" :columns="scrollableColumns" :dataKey="dataKey" :selection="selection" :selectionKeys="d_selectionKeys" :selectionMode="selectionMode"
<DTTableBody v-if="frozenValue" :value="frozenValue" :columns="scrollableColumns" :dataKey="dataKey" :selection="selection" :selectionKeys="d_selectionKeys" :selectionMode="selectionMode" :contextMenuSelection="contextMenuSelection"
:rowGroupMode="rowGroupMode" :groupRowsBy="groupRowsBy" :expandableRowGroups="expandableRowGroups" :rowClass="rowClass" :editMode="editMode" :compareSelectionBy="compareSelectionBy"
:expandedRowIcon="expandedRowIcon" :collapsedRowIcon="collapsedRowIcon" :expandedRows="expandedRows" :expandedRowKeys="d_expandedRowKeys" :expandedRowGroups="expandedRowGroups"
:editingRows="editingRows" :editingRowKeys="d_editingRowKeys" :templates="$scopedSlots"
@rowgroup-toggle="toggleRowGroup" @row-click="onRowClick($event)" @row-touchend="onRowTouchEnd" @row-keydown="onRowKeyDown"
@rowgroup-toggle="toggleRowGroup" @row-click="onRowClick($event)" @row-rightclick="onRowRightClick($event)" @row-touchend="onRowTouchEnd" @row-keydown="onRowKeyDown"
@row-mousedown="onRowMouseDown" @row-dragstart="onRowDragStart($event)" @row-dragover="onRowDragOver($event)" @row-dragleave="onRowDragLeave($event)" @row-dragend="onRowDragEnd($event)" @row-drop="onRowDrop($event)"
@row-toggle="toggleRow($event)" @radio-change="toggleRowWithRadio($event)" @checkbox-change="toggleRowWithCheckbox($event)"
@cell-edit-init="onCellEditInit($event)" @cell-edit-complete="onCellEditComplete($event)" @cell-edit-cancel="onCellEditCancel($event)"
@ -242,6 +242,10 @@ export default {
type: Boolean,
default: true
},
contextMenuSelection: {
type: Object,
default: null
},
rowHover: {
type: Boolean,
default: false
@ -617,6 +621,7 @@ export default {
onRowClick(e) {
const event = e.originalEvent;
const target = event.target;
const rowIndex = event.index;
const targetNode = target.nodeName;
const parentNode = target.parentElement && target.parentElement.nodeName;
@ -656,7 +661,7 @@ export default {
this.$emit('update:selection', _selection);
}
this.$emit('row-unselect', {originalEvent: event, data: rowData, type: 'row'});
this.$emit('row-unselect', {originalEvent: event, data: rowData, index: rowIndex, type: 'row'});
}
else {
if(this.isSingleSelectionMode()) {
@ -668,18 +673,18 @@ export default {
this.$emit('update:selection', _selection);
}
this.$emit('row-select', {originalEvent: event, data: rowData, type: 'row'});
this.$emit('row-select', {originalEvent: event, data: rowData, index: rowIndex, type: 'row'});
}
}
else {
if (this.selectionMode === 'single') {
if (selected) {
this.$emit('update:selection', null);
this.$emit('row-unselect', {originalEvent: event, data: rowData, type: 'row'});
this.$emit('row-unselect', {originalEvent: event, data: rowData, index: rowIndex, type: 'row'});
}
else {
this.$emit('update:selection', rowData);
this.$emit('row-select', {originalEvent: event, data: rowData, type: 'row'});
this.$emit('row-select', {originalEvent: event, data: rowData, index: rowIndex, type: 'row'});
}
}
else if (this.selectionMode === 'multiple') {
@ -687,12 +692,12 @@ export default {
const selectionIndex = this.findIndexInSelection(rowData);
const _selection = this.selection.filter((val, i) => i != selectionIndex);
this.$emit('update:selection', _selection);
this.$emit('row-unselect', {originalEvent: event, data: rowData, type: 'row'});
this.$emit('row-unselect', {originalEvent: event, data: rowData, index: rowIndex, type: 'row'});
}
else {
const _selection = this.selection ? [...this.selection, rowData] : [rowData];
this.$emit('update:selection', _selection);
this.$emit('row-select', {originalEvent: event, data: rowData, type: 'row'});
this.$emit('row-select', {originalEvent: event, data: rowData, index: rowIndex, type: 'row'});
}
}
}
@ -701,6 +706,12 @@ export default {
this.rowTouched = false;
},
onRowRightClick(event) {
DomHandler.clearSelection();
this.$emit('update:contextMenuSelection', event.data);
this.$emit('row-contextmenu', event);
},
onRowTouchEnd() {
this.rowTouched = true;
},

22
src/components/datatable/TableBody.vue
View File

@ -12,7 +12,7 @@
</tr>
<tr :class="getRowClass(rowData)" :key="getRowKey(rowData, index)"
v-if="expandableRowGroups ? isRowGroupExpanded(rowData): true"
@click="onRowClick($event, rowData, index)" @touchend="onRowTouchEnd($event)" @keydown="onRowKeyDown($event, rowData, index)" :tabindex="selectionMode ? '0' : null"
@click="onRowClick($event, rowData, index)" @contextmenu="onRowRightClick($event, rowData, index)" @touchend="onRowTouchEnd($event)" @keydown="onRowKeyDown($event, rowData, index)" :tabindex="selectionMode ? '0' : null"
@mousedown="onRowMouseDown($event)" @dragstart="onRowDragStart($event, index)" @dragover="onRowDragOver($event,index)" @dragleave="onRowDragLeave($event)" @dragend="onRowDragEnd($event)" @drop="onRowDrop($event)">
<template v-for="(col,i) of columns">
<DTBodyCell v-if="shouldRenderBodyCell(value, col, index)" :key="col.columnKey||col.field||i" :rowData="rowData" :column="col" :index="index" :selected="isSelected(rowData)"
@ -137,6 +137,10 @@ export default {
type: String,
default: null
},
contextMenuSelection: {
type: Object,
default: null
},
rowClass: {
type: null,
default: null
@ -185,6 +189,12 @@ export default {
});
}
if (this.contextMenuSelection) {
rowStyleClass.push({
'p-highlight-contextmenu': this.isSelectedWithContextMenu(rowData)
});
}
if (this.rowClass) {
let rowClassValue = this.rowClass(rowData);
@ -321,6 +331,13 @@ export default {
return false;
},
isSelectedWithContextMenu(rowData) {
if (rowData && this.contextMenuSelection) {
return this.equals(rowData, this.contextMenuSelection, this.dataKey);
}
return false;
},
findIndexInSelection(rowData) {
return this.findIndex(rowData, this.selection);
},
@ -346,6 +363,9 @@ export default {
onRowClick(event, rowData, rowIndex) {
this.$emit('row-click', {originalEvent: event, data: rowData, index: rowIndex});
},
onRowRightClick(event, rowData, rowIndex) {
this.$emit('row-rightclick', {originalEvent: event, data: rowData, index: rowIndex});
},
onRowTouchEnd(event) {
this.$emit('row-touchend', event);
},

2
src/components/tabmenu/TabMenu.vue
View File

@ -31,7 +31,7 @@ export default {
event.preventDefault();
return;
}
if (item.command) {
item.command({
originalEvent: event,

5
src/router.js
View File

@ -220,6 +220,11 @@ export default new Router({
path: '/datatable/style',
name: 'datatablestyle',
component: () => import('./views/datatable/DataTableStyleDemo.vue')
},
{
path: '/datatable/contextmenu',
name: 'datatablecontextmenu',
component: () => import('./views/datatable/DataTableContextMenuDemo.vue')
},
{
path: '/dataview',

120
src/views/datatable/DataTableContextMenuDemo.vue Normal file
View File

@ -0,0 +1,120 @@
<template>
<div>
<DataTableSubMenu />
<div class="content-section introduction">
<div class="feature-intro">
<h1>DataTable - ContextMenu</h1>
<p>CDataTable has exclusive integration with ContextMenu.</p>
</div>
</div>
<div class="content-section implementation">
<DataTable :value="cars" :contextMenuSelection.sync="selectedCar" @row-contextmenu="onRowContextMenu">
<Column field="vin" header="Vin"></Column>
<Column field="year" header="Year"></Column>
<Column field="brand" header="Brand"></Column>
<Column field="color" header="Color"></Column>
</DataTable>
<ContextMenu :model="menuModel" ref="cm" />
</div>
<div class="content-section documentation">
<TabView>
<TabPanel header="Source">
<CodeHighlight>
<template v-pre>
&lt;DataTable :value="cars" :contextMenuSelection.sync="selectedCar" @row-contextmenu="onRowContextMenu"&gt;
&lt;Column field="vin" header="Vin"&gt;&lt;/Column&gt;
&lt;Column field="year" header="Year"&gt;&lt;/Column&gt;
&lt;Column field="brand" header="Brand"&gt;&lt;/Column&gt;
&lt;Column field="color" header="Color"&gt;&lt;/Column&gt;
&lt;/DataTable&gt;
&lt;ContextMenu :model="menuModel" ref="cm" /&gt;
</template>
</CodeHighlight>
<CodeHighlight lang="javascript">
import CarService from '../../service/CarService';
export default {
data() {
return {
cars: null,
selectedCar: null,
menuModel: [
{label: 'View', icon: 'pi pi-fw pi-search', command: () => this.viewCar(this.selectedCar)},
{label: 'Delete', icon: 'pi pi-fw pi-times', command: () => this.deleteCar(this.selectedCar)}
]
}
},
carService: null,
created() {
this.carService = new CarService();
},
mounted() {
this.carService.getCarsSmall().then(data => this.cars = data);
},
methods: {
onRowContextMenu(event) {
this.$refs.cm.show(event.originalEvent);
},
viewCar(car) {
this.$toast.add({severity: 'info', summary: 'Car Selected', detail: car.vin + ' - ' + car.brand});
},
deleteCar(car) {
this.cars = this.cars.filter((c) => c.vin !== car.vin);
this.$toast.add({severity: 'info', summary: 'Car Deleted', detail: car.vin + ' - ' + car.brand});
this.selectedCar = null;
}
}
}
</CodeHighlight>
</TabPanel>
</TabView>
</div>
</div>
</template>
<script>
import CarService from '../../service/CarService';
import DataTableSubMenu from './DataTableSubMenu';
export default {
data() {
return {
cars: null,
selectedCar: null,
menuModel: [
{label: 'View', icon: 'pi pi-fw pi-search', command: () => this.viewCar(this.selectedCar)},
{label: 'Delete', icon: 'pi pi-fw pi-times', command: () => this.deleteCar(this.selectedCar)}
]
}
},
carService: null,
created() {
this.carService = new CarService();
},
mounted() {
this.carService.getCarsSmall().then(data => this.cars = data);
},
methods: {
onRowContextMenu(event) {
this.$refs.cm.show(event.originalEvent);
},
viewCar(car) {
this.$toast.add({severity: 'info', summary: 'Car Selected', detail: car.vin + ' - ' + car.brand});
},
deleteCar(car) {
this.cars = this.cars.filter((c) => c.vin !== car.vin);
this.$toast.add({severity: 'info', summary: 'Car Deleted', detail: car.vin + ' - ' + car.brand});
this.selectedCar = null;
}
},
components: {
'DataTableSubMenu': DataTableSubMenu
}
}
</script>

70
src/views/datatable/DataTableDoc.vue
View File

@ -1357,6 +1357,58 @@ export default {
this.carService.getCarsMedium().then(data => this.cars = data);
}
}
</CodeHighlight>
<h3>ContextMenu</h3>
<p>DataTable provides exclusive integration with the ContextMenu component using <i>contextMenuSelection</i> property along with the <i>row-contextmenu</i> event.
<CodeHighlight>
<template v-pre>
&lt;DataTable :value="cars" :contextMenuSelection.sync="selectedCar" @row-contextmenu="onRowContextMenu"&gt;
&lt;Column field="vin" header="Vin"&gt;&lt;/Column&gt;
&lt;Column field="year" header="Year"&gt;&lt;/Column&gt;
&lt;Column field="brand" header="Brand"&gt;&lt;/Column&gt;
&lt;Column field="color" header="Color"&gt;&lt;/Column&gt;
&lt;/DataTable&gt;
&lt;ContextMenu :model="menuModel" ref="cm" /&gt;
</template>
</CodeHighlight>
<CodeHighlight lang="javascript">
import CarService from '../../service/CarService';
export default {
data() {
return {
cars: null,
selectedCar: null,
menuModel: [
{label: 'View', icon: 'pi pi-fw pi-search', command: () => this.viewCar(this.selectedCar)},
{label: 'Delete', icon: 'pi pi-fw pi-times', command: () => this.deleteCar(this.selectedCar)}
]
}
},
carService: null,
created() {
this.carService = new CarService();
},
mounted() {
this.carService.getCarsSmall().then(data => this.cars = data);
},
methods: {
onRowContextMenu(event) {
this.$refs.cm.show(event.originalEvent);
},
viewCar(car) {
this.$toast.add({severity: 'info', summary: 'Car Selected', detail: car.vin + ' - ' + car.brand});
},
deleteCar(car) {
this.cars = this.cars.filter((c) => c.vin !== car.vin);
this.$toast.add({severity: 'info', summary: 'Car Deleted', detail: car.vin + ' - ' + car.brand});
this.selectedCar = null;
}
}
}
</CodeHighlight>
<h3>Empty Message</h3>
@ -1738,6 +1790,12 @@ export default {
when set to false selection of each item
can be toggled individually. On touch enabled devices, metaKeySelection is turned off automatically.</td>
</tr>
<tr>
<td>contextMenuSelection</td>
<td>object</td>
<td>null</td>
<td>Selected row instance with the ContextMenu.</td>
</tr>
<tr>
<td>rowHover</td>
<td>boolean</td>
@ -1935,13 +1993,22 @@ export default {
<tr>
<td>row-click</td>
<td>event.originalEvent: Browser event. <br />
event.data: Selected row data.</td>
event.data: Selected row data. <br />
event.index: Row index.</td>
<td>Callback to invoke when a row is clicked.</td>
</tr>
<tr>
<td>row-contextmenu</td>
<td>event.originalEvent: Browser event. <br />
event.data: Selected row data. <br />
event.index: Row index.</td>
<td>Callback to invoke when a row is selected with a ContextMenu.</td>
</tr>
<tr>
<td>row-select</td>
<td>event.originalEvent: Browser event. <br />
event.data: Selected row data. <br />
event.index: Row index. <br />
event.type: Type of the selection, valid values are "row", "radio" or "checkbox".</td>
<td>Callback to invoke when a row is selected.</td>
</tr>
@ -1949,6 +2016,7 @@ export default {
<td>row-unselect</td>
<td>event.originalEvent: Browser event. <br />
event.data: Unselected row data. <br />
event.index: Row index. <br />
event.type: Type of the selection, valid values are "row", "radio" or "checkbox".</td>
<td>Callback to invoke when a row is unselected.</td>
</tr>

1
src/views/datatable/DataTableSubMenu.vue
View File

@ -16,6 +16,7 @@
<li><router-link to="/datatable/colresize">&#9679; ColResize</router-link></li>
<li><router-link to="/datatable/reorder">&#9679; Reorder</router-link></li>
<li><router-link to="/datatable/rowgroup">&#9679; RowGroup</router-link></li>
<li><router-link to="/datatable/contextmenu">&#9679; ContextMenu</router-link></li>
<li><router-link to="/datatable/responsive">&#9679; Responsive</router-link></li>
<li><router-link to="/datatable/export">&#9679; Export</router-link></li>
<li><router-link to="/datatable/state">&#9679; State</router-link></li>

2
src/views/panelmenu/PanelMenuDemo.vue
View File

@ -79,7 +79,7 @@ export default {
{
label: 'New',
icon:'pi pi-fw pi-user-plus',
},
{
label: 'Delete',

4
src/views/panelmenu/PanelMenuDoc.vue
View File

@ -78,7 +78,7 @@ export default {
{
label: 'New',
icon:'pi pi-fw pi-user-plus',
},
{
label: 'Delete',
@ -288,7 +288,7 @@ export default {
{
label: 'New',
icon:'pi pi-fw pi-user-plus',
},
{
label: 'Delete',