From 2e486d41f2793d054bf1bddac51e55d9b8510fb9 Mon Sep 17 00:00:00 2001 From: MinGyoon Woo Date: Fri, 19 Jul 2024 13:44:55 +0900 Subject: [PATCH 1/2] Add preventDocumentFragmentUsage condition to checkboxSelector --- .../common/src/extensions/slickCheckboxSelectColumn.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/common/src/extensions/slickCheckboxSelectColumn.ts b/packages/common/src/extensions/slickCheckboxSelectColumn.ts index 46b36a72c..84ced336e 100644 --- a/packages/common/src/extensions/slickCheckboxSelectColumn.ts +++ b/packages/common/src/extensions/slickCheckboxSelectColumn.ts @@ -220,8 +220,8 @@ export class SlickCheckboxSelectColumn { * @param {Boolean} checked - is the input checkbox checked? * @returns */ - createCheckboxElement(inputId: string, checked = false): DocumentFragment { - const fragmentElm = new DocumentFragment(); + createCheckboxElement(inputId: string, checked = false): DocumentFragment | HTMLSpanElement { + const checkboxElm = this.gridOptions?.preventDocumentFragmentUsage ? document.createElement('span') : new DocumentFragment(); const labelElm = createDomElement('label', { className: 'checkbox-selector-label', htmlFor: inputId }); const divElm = createDomElement('div', { className: 'icon-checkbox-container' }); divElm.appendChild( @@ -231,9 +231,9 @@ export class SlickCheckboxSelectColumn { createDomElement('div', { className: `mdi ${checked ? CHECK_ICON : UNCHECK_ICON}` }) ); labelElm.appendChild(divElm); - fragmentElm.appendChild(labelElm); + checkboxElm.appendChild(labelElm); - return fragmentElm; + return checkboxElm; } getColumnDefinition(): Column { From ab6aaffe2ff7b421aa6870abfbb1ec2de14d77bd Mon Sep 17 00:00:00 2001 From: MinGyoon Woo Date: Fri, 19 Jul 2024 13:54:37 +0900 Subject: [PATCH 2/2] Add preventDocumentFragmentUsage for Salesforce Usage --- packages/common/src/extensions/slickCheckboxSelectColumn.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/common/src/extensions/slickCheckboxSelectColumn.ts b/packages/common/src/extensions/slickCheckboxSelectColumn.ts index 84ced336e..6a4cbc26a 100644 --- a/packages/common/src/extensions/slickCheckboxSelectColumn.ts +++ b/packages/common/src/extensions/slickCheckboxSelectColumn.ts @@ -348,7 +348,7 @@ export class SlickCheckboxSelectColumn { }); } - protected checkboxSelectionFormatter(row: number, _cell: number, _val: any, _columnDef: Column, dataContext: any, grid: SlickGrid): DocumentFragment | null { + protected checkboxSelectionFormatter(row: number, _cell: number, _val: any, _columnDef: Column, dataContext: any, grid: SlickGrid): DocumentFragment | HTMLSpanElement | null { if (dataContext && this.checkSelectableOverride(row, dataContext, grid)) { const UID = this.createUID() + row; return this.createCheckboxElement(`selector${UID}`, !!this._selectedRowsLookup[row]);