primeui
primeui copied to clipboard
can tree (treetable) support id/pid json?
- can tree (treetable) support id/pid json? data: [ { id:0, pid: -1, name: 'Documents', size: '75kb', type: 'Folder' }, { id:1, pid: 0, name: 'Work', size: '55kb', type: 'Folder' }, { id: 2, pid:1, name: 'Expenses.doc', size: '30kb', type: 'Document' }, { id: 3, pid: 1, name: 'Resume.doc', size: '25kb', type: 'Resume' }, { id: 4, pid: 0, name: 'Home', size: '20kb', type: 'Folder' }, { id: 5, pid: 4, name: 'Invoices', size: '20kb', type: 'Text' } ]
- can it support checkbox? data: [ { id:0, pid: -1, checked: true, name: 'Documents', size: '75kb', type: 'Folder' }, { id:1, pid: 0, checked: true, name: 'Work', size: '55kb', type: 'Folder' }, { id: 2, pid:1, checked: true, name: 'Expenses.doc', size: '30kb', type: 'Document' }, { id: 3, pid: 1, checked: true, name: 'Resume.doc', size: '25kb', type: 'Resume' }, { id: 4, pid: 0, checked: true, name: 'Home', size: '20kb', type: 'Folder' }, { id: 5, pid: 4, checked: true, name: 'Invoices', size: '20kb', type: 'Text' } ]
No, you need PrimeUI TreeTable for that;
http://www.primefaces.org/primeui/#treetable
Sorry I thought you were using PrimeFaces :) Please use forum for questions not the issue tracker. As a quick answer checkbox is not supported yet, PrimeFaces has it but not PrimeUI.
Number 1 should be supported, do you have an issue?
thank you for you answer, but for number 1, i can't get the right pid/id json, like it in database..
<script>
$(function () {
$('#container').puitreetable({
columns: [
{ field: 'name', headerText: 'Name' },
{ field: 'size', headerText: 'Size' },
{ field: 'type', headerText: 'Type' }
],
nodes: [
//{
// data: { name: 'Documents', size: '75kb', type: 'Folder' },
// children: [
// {
// data: { name: 'Work', size: '55kb', type: 'Folder' },
// children: [
// {
// data: { name: 'Expenses.doc', size: '30kb', type: 'Document' }
// },
// {
// data: { name: 'Resume.doc', size: '25kb', type: 'Resume' }
// }
// ]
// },
// {
// data: { name: 'Home', size: '20kb', type: 'Folder' },
// children: [
// {
// data: { name: 'Invoices', size: '20kb', type: 'Text' }
// }
// ]
// }
// ]
//},
//{
// data: { name: 'Pictures', size: '150kb', type: 'Folder' },
// children: [
// {
// data: { name: 'barcelona.jpg', size: '90kb', type: 'Picture' }
// },
// {
// data: { name: 'primeui.png', size: '30kb', type: 'Picture' }
// },
// {
// data: { name: 'optimus.jpg', size: '30kb', type: 'Picture' }
// }
// ]
//},
{ id:0, pid: -1, name: 'Documents', size: '75kb', type: 'Folder' },
{ id:1, pid: 0, name: 'Work', size: '55kb', type: 'Folder' },
{ id: 2, pid:1, name: 'Expenses.doc', size: '30kb', type: 'Document' },
{ id: 3, pid: 1, name: 'Resume.doc', size: '25kb', type: 'Resume' },
{ id: 4, pid: 0, name: 'Home', size: '20kb', type: 'Folder' },
{ id: 5, pid: 4, name: 'Invoices', size: '20kb', type: 'Text' }
]
});
});
</script>
i give another project to show what i mean, just the 2nd one.
http://www.ztree.me/v3/demo.php#_101 http://www.ztree.me/v3/demo.php#_102