Issue with multiselect and add new in the latest version.

[EtiAggarwal]

I created a table that has add new and multiselect options, but when add new is clicked, the columns shift to left. I have attached screenshots for reference.

columns shift to left

I am using angular 4

[karangarg45]

has this been fixed? or any workaround?

[EtiAggarwal]

I had to edit the row template. It is missing the checkbox tag

[kohanevich85]

that's because of this [ng2-st-thead-form-row] component has issue in template <td *ngIf=""></td> but should be: <td *ngIf="grid.isMultiSelectVisible()"></td> I have some workaround, I manipulated to DOM directly but it's bad solution, append first child <td/> to <tr>

[sendruck]

@kohanevich85 can you please share the code of your temporary workaround in case it's will not merge

[kohanevich85]

Here is an example of fix. It's direct DOM manipulating there is bad practice, but it works for me. I think these magic numbers should work for you as well.

constructor(private elRef: ElementRef, private _renderer: Renderer2) {

ngAfterViewChecked() { let firstRow = 2; let columnOffset = 4; if (this.elRef.nativeElement.querySelector('.ng2-smart-action-add-create')) { let td = this._renderer.createElement("td"); let tr = this.elRef.nativeElement.getElementsByTagName('tr')[firstRow]; let refChild = tr.childNodes[columnOffset]; if (refChild.className === 'ng2-smart-actions') { this._renderer.insertBefore(tr, td, refChild); } } }

[sendruck]

@kohanevich85 Where did you implement this code?

[sendruck]

Is it ok to implement hook in the constructor, cos it didn't work for me((

[kohanevich85]

in this case it doesn't matter because of direct DOM manipulation and on event after view checked (ngAfterViewChecked). This code just should run. I used this code in component which include smart-table component.

[kohanevich85]

constructor is not appropriate hook for this try to use ngAfterViewChecked()

[sendruck]

Thanks, I didnt use checkboxes, so there is no more problem for me