![]() System : Linux absol.cf 5.4.0-198-generic #218-Ubuntu SMP Fri Sep 27 20:18:53 UTC 2024 x86_64 User : www-data ( 33) PHP Version : 7.4.33 Disable Function : pcntl_alarm,pcntl_fork,pcntl_waitpid,pcntl_wait,pcntl_wifexited,pcntl_wifstopped,pcntl_wifsignaled,pcntl_wifcontinued,pcntl_wexitstatus,pcntl_wtermsig,pcntl_wstopsig,pcntl_signal,pcntl_signal_get_handler,pcntl_signal_dispatch,pcntl_get_last_error,pcntl_strerror,pcntl_sigprocmask,pcntl_sigwaitinfo,pcntl_sigtimedwait,pcntl_exec,pcntl_getpriority,pcntl_setpriority,pcntl_async_signals,pcntl_unshare, Directory : /var/www/html/libs/absol-doc/content/acomp/component/ |
Upload File : |
## [Demo](https://absol.cf/libs/absol-acomp/demo/tablescroller.html) ## Hướng dẫn ### Tạo mới ```js //chuẩn bị dữ liệu var cities = [...cityList]; //Tạo bảng theo cách thông thường var matrixTable = render({ tag: 'table', child: [ { tag:'thead', child:[...childList]}, { tag: 'tbody', child: [ { tag: 'tr', child:[ { tag: 'td', class: 'as-drag-zone', child:[...moveIcon] } ,...otherCells] }, ...otherRows ] } ] }); var currentCitiesArr = cities.slice(); var mTableScroller2 = _({ tag: 'tablescroller', style: { height: '500px', width: '700px' }, props: { fixedCol: 4 }, child: matrixTable, on:{ orderchange: function(event){ console.log(event.from, event.to); //cập nhật dữ liệu khi người dùng kéo thả var city = currentCitiesArr[event.from]; currentCitiesArr.splice(event.from, 1); currentCitiesArr.splice(event.to, 0, city); console.log(currentCitiesArr.slice()); } } }).addTo(document.body); ``` > Kể từ phiên bản này trở đi, có thể sử dụng các đối tượng có tương tác như checkbox, button, radio... để trong phần cố định > **Không** được thay đổi trường `fixedCol` sau khi tạo ### css **--tvs-scroll-padding-bottom**: phần padding ở dưới khi cuộn