Treeview with multiple line content

[Ryan Ngoh]

I am making a list with draggable items, I found a post that says I have to use TreeViewComponent to mimic the drag ability. I have a TreeViewComponent and using nodeTemplate to load a custom template with multiple lines. (These items may have a lot of text and is required to take multiple lines)

<div><p>{item.id}</p><p>{item.address}</p><p>{item.otherInfo}</p></div>

How would I adjust the draggable row height (element class: e-fullrow) to be the same as the row content (element class: e-text-content)?

Attachment: ipm7n3.run_e07f1663.zip

[Silambarasan I]

Hi Ryan, 

 

Thank you for contacting Syncfusion support. 

 

We have checked your reported query and you can set the draggable row height (element class: e-fullrow) to be the same as the row content (element class: e-text-content) by using the following code snippet. 

 

 

element.style.height = element.nextElementSibling.offsetHeight +"px"; 

 

 

In the below example, we set the height for the element while hovering the node using mouseover event and also, we set the height of the droppedNode. Please refer the following sample 

 

Sample: 

https://stackblitz.com/edit/react-vfpxrx?file=index.js 

 

Could you please check the above sample and get back to us if we misunderstood your requirement or need further assistance? 

 

Regards, 

Silambarasan