dataview questions.

Webix JS
#1

Wonder if someone could assist me. Been trying to figure these issue out over the holiday with no luck.

http://webix.com/snippet/cecd348a

  1. if I use the same variable grid_data_columns for columns: in each of the views,
    only one view will show data, other will not. If I create a new copy of grid_data_columns and use a different name all works well. By design?

  2. I have borderless: true set, but I am still seeing the grid lines the the dataview, not sure why.

  3. When I change tabs in the tabbar I handle the OnChange message, binding to the right view. I seem to be able to update the header with the title but I am unable to update details in the view.

Any help anyone can provide would be most appreciated.

#2

http://webix.com/snippet/c0edaea0

changed right view to htmlview - still no luck :(, has this working once.

#3

Hello,

(1) Datatable columns are processed by Webix code, so you need to make a copy of the columns array as webix.copy(grid_data_columns).

(2) The borderless:true setting affects outer borders of the whole widget. They only way to remove the gridlines is altering the CSS:

JS:

{ view:"datatable", css:"sOffers"}

CSS:

  .sOffers .webix_column>div{ border:none; }

Or, remove the additional sOffers class to apply the rule for all the Datatables in the app.

(3) As to binding please note that you can either bing a form or a template to the data widget.

If it’s a template, then item data will be distributed according to placeholders in hash (#) signs. At the same time, the form distributes item data according to the name properties of its elements.

Please, check the related snippet: http://webix.com/snippet/91b546a2

#4

Also, what concerns binding, you needn’t perform bind/unbind on each tabbar clicking. You can bind both views all at once: http://webix.com/snippet/f3ac637d

Still, the better practice for the case with identical datatables is to use only 1 datatable and parse the related data to it when tabbar value changes: http://webix.com/snippet/9786252e

#5

Halga, thanks you for your assistance once again.
(1) worked perfectly, would have never found this.
(2) worked perfectly. Not sure how I had this working before, maybe I copied from an example by mistake.
(3) spend some time trying to work out how your snippet differed from mine until I spotted the that I had set the view type, so I now have this working. I also note that you make the following call
$$(“tabbar”).callEvent(“onChange”, [“sOffers”]) to setup the first tab correctly. This works great in your snippet but for some reason not in my code. Still trying to work out why.

With regards to binding. good idea binding all at startup, the right painel however I’m thinking could be changed dependent on the view, that being said I dont suppose there is any issue creating all the views and just showing the one thats required.

Provided snippet has been kept simple and I use this just to see and resolve different issues. It is possible I would have different views for different tabs, sometimes its just as easy to write more code than add additional parse routines + I don’t understand them fully:)
Learning slowly, again thanks for your assistance.
Gee