Set the dropdown value with Fullpath delimeter ->

[ASIM TAUSIF KHAN]

Hi,

      I want to set the dropdown value with fullpath delimeter "->". i have folder tree like 

A1

    B1

        C2

        D1

    B2

    C2

    D2

and

      A1

      B1

      C1

           A2

           B2

           C2

how to set the C2 with fullpath in both scenario/

[Prince Oliver]

Hello ASIM, 

Thank you for contacting us. 

To achieve your requirement, you can use the textmode as fullpath with delimiter. Kindly refer to the following UG documentation for further reference: https://help.syncfusion.com/js/dropdowntree/textmode#textmode-with-fullpathdelimiter 

We have attached an example for your requirement, please find it in the following location: https://jsplayground.syncfusion.com/qgiu4f3w 

Let us know if you need any further assistance on this. 

 

Regards, 

Prince 

[ASIM TAUSIF KHAN]

Actually my question was that how to set full path in edit mode if the path is save like C1->C2

[Prince Oliver]

Hi ASIM, 

We could not fully get your requirement in our end. Do you mean to preselect a value and set a full path? Or do you need to get full path is some event? Kindly share us more information on your requirement. This will help us provide a prompt solution. 

Regards, 

Prince 

[ASIM TAUSIF KHAN]

yes i want to  preselect a value and set a full path

[Prince Oliver]

Hi ASIM, 

Thank you for your update. 

To preselect a value and set a full path in the DropDownTree component, you need to set the selected field in the dataSource. Kindly refer to the following code. 

<script> 

var localData = [ 

    { id: 1, name: "A1", hasChild: true }, 

    { id: 2, pid: 1, name: "B1", hasChild: true  }, 

    { id: 3, pid: 1, name: "B2" }, 

    { id: 4, pid: 1, name: "C2" }, 

    { id: 6, pid: 1, name: "D2" }, 

    { id: 8, pid: 2, name: "C2", selected: true }, 

    { id: 9, pid: 2, name: "D1" } 

]; 

$('#itemList').ejDropDownTree({ 

    treeViewSettings: { 

        fields: { id: "id", parentId: "pid", value: "id", text: "name", hasChild: "hasChild", dataSource: localData , selected: "selected" } 

    }, 

    textMode: "fullPath", 

    fullPathDelimiter: "->" 

}); 

</script> 

We have attached the modified sample for your reference, please find it in the following location: https://jsplayground.syncfusion.com/qrpzek3z  

Let us know if you need any further assistance on this. 

Regards, 

Prince