Message Boards

AlloyUI Treeview : Single Select (Please Help)

Koffi AGHOSTO, modified 3 Years ago.

AlloyUI Treeview : Single Select (Please Help)

Junior Member Posts: 67 Join Date: 5/27/14 Recent Posts
Hello,
I am using Liferay DXP and I use aui treeview for single select (means, I want to check only one checkbox) but I can't find
any solution to do it. I put 'type=radio' on my treeview but it is not working.

Please, help me, any suggestion is welcomed.
Thank you in advanced,
Koffi
thumbnail
Mohammed Yasin, modified 2 Years ago.

RE: AlloyUI Treeview : Single Select (Please Help) (Answer)

Liferay Master Posts: 591 Join Date: 8/8/14 Recent Posts
Hi,
Have u checked https://alloyui.com/examples/tree/real-world.html , this may help you.
​​​​​​​Example
<div id="myTreeView"></div>
<aui:script>
&nbsp;&nbsp; &nbsp;AUI().use(
&nbsp; 'aui-tree-view',
&nbsp; function(A) {
&nbsp; &nbsp; new A.TreeViewDD(
&nbsp; &nbsp; &nbsp; {
&nbsp; &nbsp; &nbsp; &nbsp; boundingBox: '#myTreeView',
&nbsp; &nbsp; &nbsp; &nbsp; children: [
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; children: [
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {label: 'Watermelon', leaf: true, type: 'check'},
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {label: 'Apricot', leaf: true, type: 'check'},
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {label: 'Pineapple', leaf: true, type: 'check'},
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {label: 'Kiwi', leaf: true, type: 'check'},
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {label: 'Orange', leaf: true, type: 'check'},
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {label: 'Pomegranate', leaf: true, type: 'check'}
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ],
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; expanded: true,
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; label: 'Checkboxes'
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; },
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; children: [
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {label: 'Watermelon', leaf: true, type: 'radio'},
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {label: 'Apricot', leaf: true, type: 'radio'},
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {label: 'Pineapple', leaf: true, type: 'radio'},
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {label: 'Kiwi', leaf: true, type: 'radio'},
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {label: 'Orange', leaf: true, type: 'radio'},
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {label: 'Pomegranate', leaf: true, type: 'radio'}
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ],
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; expanded: true,
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; label: 'Radio'
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; },
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; children: [
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {label: 'Watermelon', leaf: true, type: 'task'},
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {label: 'Apricot', leaf: true, type: 'task'},
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {label: 'Pineapple', leaf: true, &nbsp;type: 'task'},
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {label: 'Kiwi', leaf: true, type: 'task'},
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {label: 'Orange', leaf: true, type: 'task'},
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {label: 'Pomegranate', leaf: true, &nbsp;type: 'task'}
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ],
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; expanded: true,
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; label: 'Task',
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; type: 'task'
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }
&nbsp; &nbsp; &nbsp; &nbsp; ]
&nbsp; &nbsp; &nbsp; }
&nbsp; &nbsp; ).render();
&nbsp; }
);
</aui:script>

Koffi AGHOSTO, modified 3 Years ago.

RE: AlloyUI Treeview : Single Select (Please Help)

Junior Member Posts: 67 Join Date: 5/27/14 Recent Posts
Hello Yasin,

Thank you very much, you have helped me a lot.  I can't see that each JSON line have a 'type' property, so your answer
helps me a lot.

Thank you,
Have a nice day,
Koffi