Fixed #2312 - New DataTable editor callbacks

pull/2313/head
Tuğçe Küçükoğlu 2022-03-14 15:33:01 +03:00
parent 49c8744686
commit f08a05404b
3 changed files with 31 additions and 7 deletions

View File

@ -269,6 +269,10 @@ export interface ColumnSlots {
* Whether the row is frozen.
*/
frozenRow: boolean;
/**
* Callback function
*/
editorInitCallback: () => void;
}) => VNode[];
/**
* Custom header template.
@ -280,7 +284,7 @@ export interface ColumnSlots {
*/
column: Column;
}) => VNode[];
/**
/**
* Custom footer template.
* @param {Object} scope - footer slot's params.
*/
@ -315,8 +319,16 @@ export interface ColumnSlots {
* Whether the row is frozen.
*/
frozenRow: boolean;
/**
* Callback function
*/
editorSaveCallback: () => void;
/**
* Callback function
*/
editorCancelCallback: () => void;
}) => VNode[];
/**
/**
* Custom filter template.
* @param {Object} scope - filter slot's params.
*/
@ -354,7 +366,7 @@ export interface ColumnSlots {
*/
filterCallback: () => void;
}) => VNode[];
/**
/**
* Custom filter footer template.
* @param {Object} scope - filter footer slot's params.
*/

View File

@ -4,8 +4,8 @@
</td>
<td v-else :style="containerStyle" :class="containerClass" @click="onClick" @keydown="onKeyDown" role="cell">
<span v-if="responsiveLayout === 'stack'" class="p-column-title">{{columnProp('header')}}</span>
<component :is="column.children.body" :data="rowData" :column="column" :field="field" :index="rowIndex" :frozenRow="frozenRow" v-if="column.children && column.children.body && !d_editing" />
<component :is="column.children.editor" :data="editingRowData" :column="column" :field="field" :index="rowIndex" :frozenRow="frozenRow" v-else-if="column.children && column.children.editor && d_editing" />
<component :is="column.children.body" :data="rowData" :column="column" :field="field" :index="rowIndex" :frozenRow="frozenRow" :editorInitCallback="editorInitCallback" v-if="column.children && column.children.body && !d_editing" />
<component :is="column.children.editor" :data="editingRowData" :column="column" :field="field" :index="rowIndex" :frozenRow="frozenRow" :editorSaveCallback="editorSaveCallback" :editorCancelCallback="editorCancelCallback" v-else-if="column.children && column.children.editor && d_editing" />
<component :is="column.children.body" :data="editingRowData" :column="column" :field="field" :index="rowIndex" :frozenRow="frozenRow" v-else-if="column.children && column.children.body && !column.children.editor && d_editing" />
<template v-else-if="columnProp('selectionMode')">
<DTRadioButton :value="rowData" :checked="selected" @change="toggleRowWithRadio($event, rowIndex)" v-if="columnProp('selectionMode') === 'single'" />
@ -326,6 +326,15 @@ export default {
onRowEditCancel(event) {
this.$emit('row-edit-cancel', {originalEvent: event, data: this.rowData, newData: this.editingRowData, field: this.field, index: this.rowIndex});
},
editorInitCallback(event) {
this.$emit('row-edit-init', {originalEvent: event, data: this.rowData, newData: this.editingRowData, field: this.field, index: this.rowIndex});
},
editorSaveCallback(event) {
this.$emit('row-edit-save', {originalEvent: event, data: this.rowData, newData: this.editingRowData, field: this.field, index: this.rowIndex});
},
editorCancelCallback(event) {
this.$emit('row-edit-cancel', {originalEvent: event, data: this.rowData, newData: this.editingRowData, field: this.field, index: this.rowIndex});
},
updateStickyPosition() {
if (this.columnProp('frozen')) {
let align = this.columnProp('alignFrozen');

View File

@ -415,7 +415,8 @@ export default {
column: Column node <br />
field: Column field <br />
index: Row index <br />
frozenRow: Is row frozen</td>
frozenRow: Is row frozen<br />
editorInitCallback: Callback function</td>
</tr>
<tr>
<td>footer</td>
@ -427,7 +428,9 @@ export default {
column: Column node <br />
field: Column field <br />
index: Row index <br />
frozenRow: Is row frozen</td>
frozenRow: Is row frozen <br />
editorSaveCallback: Callback function <br />
editorCancelCallback: Callback function</td>
</tr>
<tr>
<td>filter</td>