Functionality
Editing
Besides viewing some info in the ordered way, List allows users to edit existing data. Just click the required item of the list and change its value the way you wish.
Click on any item to open the editor
Validation
Webix allows you to validate one record or all data set against predefined validation rules. If there's an unacceptable value, the corresponding item will be highlighted. You can also display a warning message on the screen.
Try editing the item coloured in pink
Dynamic Loading and Lazy Rendering
With one setting you can enable dynamic data loading and lazy rendering of List items. Dynamic loading lets you load the data when they are needed, which significantly improves server performance. Lazy rendering also improves performance of apps, as List items are added to the page only when they are scrolled to.
Grouplist
Grouplist allows presenting a list of data items grouped by category. Data grouping is hierarchical, which means that any group item can start its own group. Moreover, you can sort and filter all Grouplist items with no effort.
Click on the list item to see its group
Results:1
Results:1
Results:1
Results:1
Results:1
Results:2
Results:1
Results:1
Results:2
Results:1
Results:1
Results:1
Results:3
Results:3
Results:2
Results:1
Results:1
Results:4
Results:3
Results:2
Results:3
Results:2
Results:3
Results:4
Results:5
Results:2
Results:1
Results:7
Results:2
Results:4
Results:2
Results:3
Results:4
Results:2
Results:2
Results:1
Results:4
Results:2
Results:3
Results:2
Results:1
Results:2
Results:2
Results:3
Results:4
Results:3
Results:2
Results:1
Results:5
Results:4
Results:2
Results:4
Results:2
Results:4
Results:2
Results:3
Results:2
Results:4
Results:1
Results:1
Results:3
Results:2
Results:2
Results:5
Results:7
Results:2
Results:4
Results:6
Results:6
Results:5
Results:6
Results:4
Results:7
Results:7
Results:2
Results:5
Results:6
Results:8
Results:7
Results:8
Results:5
X-list
This UI-related JavaScript pagelist presents an offbeat way of data presentation. While standard lists arrange items vertically, the X-list offers horizontal patterning while keeping all the list functions.
List with a fixed width and custom CSS for items
Unitlist
Unitlist enables the presentation of data in groups derived from initial non-hierarchical datasets. With this UI widget, data items are sorted and then united by common values. Unitlist helps you to cope with a large amount of messy information by organizing it into small groups.
1957
164,558
1968
196,549
1963
37,872
2001
183,431
1971
244,189
2011
19,585
1951
42,183
1979
227,723
1986
212,588
1950
42,339
1930
26,985
2001
237,208
1984
122,177
1999
369,318
1998
305,747
2000
80,688
1977
83,123
1979
214,205
2009
380,608
1985
270,029
1975
49,207
2005
351,595
1991
101,464
1959
73,442
1948
37,003
2003
182,946
2010
191,319
1982
227,118
1995
309,611
1969
71,81
1942
202,051
1995
141,969
1974
98,824
1988
59,743
1941
163,906
1931
38,898
2002
222,818
1967
57,371
1981
85,191
1955
19,426
1954
40,345
1988
242,884
2009
227,224
1975
79,285
2001
269,56
1944
46,968
2004
110,171
1964
185,368
2011
71,966
1994
90,409
2010
15,574
2004
286,331
1982
18,941
1996
201,609
1999
507,723
2003
233,406
1965
60,679
1994
416,066
1987
198,428
1982
67,385
2000
372,697
1939
100,838
1997
205,157
1990
299,349
2008
199,415
1937
14,978
1988
47,285
1993
181,161
2011
132,656
1995
188,934
1952
41,827
2004
119,597
2010
111,43
2004
66,749
2011
8,919
1952
20,369
2008
140,536
2010
458,693
1989
217,054
2002
44,622
2009
277,969
2007
151,763
2008
34,224
1934
31,1
1946
126,537
1975
175,85
1961
18,591
2003
299,11
2004
239,182
1949
16,34
1997
203,259
1954
22,477
1962
95,054
1994
274,245
2008
88,395
1997
146,411
1979
121,347
1998
171,183
1931
49,827
1999
144,556
1979
49,572
2009
31,825
2000
358,354
1927
51,421
2004
191,29
1936
48,296
2001
175,202
1974
188,389
1939
40,325
1964
533,848
1988
46,546
2003
159,856
1984
29,57
1976
45,502
1957
14,82
2007
260,354
1959
112,951
1922
35,442
1946
38,116
2003
133,645
1954
50,425
1984
94,351
1968
97,931
1975
283,176
2006
205,065
1957
56,418
1966
22,684
2003
318,759
1986
138,443
1997
86,032
1960
182,319
1980
112,361
1981
300,252
1985
41,467
1950
49,623
2007
185,945
1954
148,162
1940
43,22
2000
243,963
1992
271,098
1976
134,838
1953
40,638
1948
41,767
1968
68,092
1998
349,866
1983
206,07
1993
355,638
1995
380,479
1954
118,925
1924
10,754
2010
216,509
2005
319,165
1952
68,547
1972
22,343
2008
249,953
2000
237,981
1959
83,549
2001
142,366
1953
24,726
1979
27,86
1986
116,136
2009
196,14
1977
393,087
1980
348,012
1983
267,993
1951
43,597
1927
14,758
1950
68,932
1976
207,461
1991
309,922
1959
30,865
1960
47,052
1966
18,001
1946
21,025
1998
230,128
1946
34,921
2007
200,219
1957
72,819
1998
33,366
2008
612,37
1978
111,537
2006
347,565
2007
43,683
1980
75,735
1973
139,364
1926
25,123
1972
511,495
1974
319,352
1925
27,436
1966
213,03
1967
99,51
1940
29,278
1940
49,085
1963
77,425
1999
271,474
1961
31,412
2004
213,232
1921
20,639
1956
31,417
2010
134,518
1994
207,905
2006
104,228
2001
494,003
2003
472,843
2002
423,855
1941
61,58
1962
28,131
1962
40,961
1999
492,325
1955
32,001
1928
14,239
2002
181,523
2006
291,029
1987
147,586
2009
40,457
1957
49,455
1994
678,79
1980
236,782
1991
324,419
1999
308,734
2010
172,619
1973
82,181
1984
237,302
1982
110,853
1949
60,907
1948
40,617
1998
221,154
1995
331,99
1953
18,138
1969
37,975
1939
129,926
2008
134,13
2007
167,743
1962
101,352
1953
11,006
1958
39,633
1995
216,349
2010
173,833
1996
195,942
1995
214,455
1992
128,601
2009
190,499
2006
307,336
1958
113,232
2008
257,704
2011
21,216
1966
25,949
1957
27,911
1957
23,3
1961
36,197
Paging ability in JavaScript List widget
You can add animated paging to the Webix JavaScript List. It will help your end user promptly find important information.
Click on the 'Next' button
Filtering
You can easily filter the data contained in Webix List JS widget. It also allows you to find important items quickly.
Type in the input fields to filter the lists
Work with the clipboard
This JavaScript List widget enables you to copy and paste list items and other HTML objects easily by using familiar hotkeys.
Use 'Ctrl+C' and 'Ctrl+V' to copy and paste list items
JavaScript drag and drop for list
Widget allows performing drag-and-drop operations not only within List itself, but also between List and Datatable, Treetable, Datatree, Dataview and even between two JavaScript Lists.