Datatable filter: focus lost on filter when the width of column is ajusted

Webix JS
1

Hello,

See example:
http://webix.com/snippet/bf031922

If now I type “def” in first filter (H1 column).
after some second I lost the focus and now if I press backspace I go to previous page because I have lost the focus.

This issue occurs when I have adjust: “data” parameter and the column width change when the filter is executed.

Webix: 3.1
With IE 11 and Chrome: 46.0.2490.86

Regards,

2

Hi,

focus is lost as the datatable paints self in order to adjust to new data set.

As a workaround you can save the column you filter and focus its filter input after filtering: http://webix.com/snippet/f6cf457e

3

The issue can’t be fully solved, as re-adjustiing data will result in repainting the datatable. As result, the focus will be lost.

You can

a) Block the global “backspace” key handler, to prevent not-expected page unloading.

b) Change the logic how adjust work, and auto-size columns only after initial data loaidng

http://webix.com/snippet/00f8c7b7

4

Hello,

Thanks for the feedback.

Currently I have deactivated this settings. Before I create the datatable I use the method: webix.html.getTextSize to compute the maximum width of each columns.
That working fine.

Regards

5

Hello Helga,

For you proposition, I have tested and I have issue with IE 11.
With IE 11 the focus is good but the cursor is not in good position.
I have fixed this solution (by setup selectionEnd and selectionStart):
http://webix.com/snippet/b7f752b3

Thanks for your help

6

Hello Maksim,

Thanks for your solution.
That working well.

Regards,

Eric.

7

I fix it.
remove adjust:true

on:{
	onAfterLoad:function(){
		this.adjustColumn("seq");
		this.adjustColumn("tableName");
		this.adjustColumn("tableComment");
	}
}
8

As others explained, the culprit is the width auto “adjust” attribute of the columns configuration. As @song7749 mentioned, removing adjust:true after the table loads solve the issue.
I came up with the generic solution below:

        on:{
        	onAfterLoad: function() {
        		for (var i in this.config.columns) {this.config.columns[i].adjust = false;}
        	}
9

Hi ,
In the datatable subview we are facing an issue with the search filter.
When we type something and leave a second gap the search filter is being outfocused.

Here is the code snippet. please help me with this.
https://snippet.webix.com/hceopfkc

10

@Gokul
you have autoheight:true in subview config.
that’s why filter looses focus on rerendering.
check this workaround.
https://snippet.webix.com/84eor0l9

11

Hi @intregal
Thanks a lot.
It’s working fine.