Syncfusion And Angularjs: Find All The Html Elements Values Present In Each Of The Html Nodes

I am using the Syncfusion to create drag and drop fields. Each of the Dropped field (Node) is the HTML NODE and it has some of the HTML elements such as Select and input etc. After

Solution 1:

By default, in the node , we only bind the node property values. We cannot bind the HTML content values used in the node. However, by using the node addInfo property you can store the text values. The addInfo property is used to store the additional or custom information of node. After edit the text box and click outside the text box, selectionChange event for the diagram gets fired. In that event get the value of the text box and bind it to the selected node addInfo property. Please refer the below code example

function selectionChange(args) {

if(args.state === 'changing' && args.changeType === 'remove') {
     node =  args.oldItems[0];
    } elseif (args.state === 'changed' && args.changeType === 'remove') {
      debugger
      node.addInfo = document.getElementById("text").value;
    }
    
  }

Video demonstration: https://www.syncfusion.com/downloads/support/directtrac/general/ze/Selection-Change-694740211

After add the values in addInfo , you can get the values of the template through node addInfo property.

We have prepared a sample for your requirement. Please find the sample in below link

Sample: http://jsplayground.syncfusion.com/tawdhvwg