Default value upon init

HI All,
I have a scenario where i have to populate a default value for a dropdown-tree in a form.
The form is inside a dialog.
The value for the dopdown tree is stored in a variable upon click of showdialog finction
So how do i populate the default value for the dropdown tree?
Please help me out on the same.

Regards,
Aditya

Attachment: editdialog_cc869e9b.zip

2 Replies 1 reply marked as answer

JC Jeremy Carter November 15, 2020 11:33 PM UTC

What I have done is:

  • Created a ViewChild ref to the dropdown
@ViewChild('dropdown') dropdown: DropDownTreeComponent
  • Wired up the created event
(created)="onDropDownCreated()"

The DropDownTreeComponent value is an array (as it supports multiple selections)
Then inside the created event you can do the following:
this.dropdown.value = [defaultValue]


SP Sowmiya Padmanaban Syncfusion Team November 17, 2020 10:02 AM UTC

Hi Aditya Murthy,  
 
Greetings from Syncfusion support. 
 
You can update the value of DropdownTree using value property of DropdownTree component by using dialog open event.  
 
 
Please, refer the below code snippet. 
 
   <ejs-dialog 
        #alertDialog 
        [visible]="hidden" 
        [showCloseIcon]="true" 
        [target]="target" 
        [width]="alertWidth" 
        (open)="dialogOpen()" 
      > 
        <ng-template #header> 
          <div title="Nancy">DropdownTree component</div> 
        </ng-template> 
        <ng-template #content> 
          <ejs-dropdowntree 
            id="multiselect" 
            #dropdownTree 
            [fields]="field" 
            [allowMultiSelection]="allowMultiSelection" 
            popupHeight="220px" 
            placeholder="Select items" 
          ></ejs-dropdowntree> 
        </ng-template> 
      </ejs-dialog> 
 
  dialogOpen() { 
    this.dropdownTree.value = ["6"]; 
  } 
 
Since, parent element (Dialog) of DropdownTree will be in hidden state until opening it. DropdownTree will be in hidden state. So when initializing it, Value won't update properly in DropdownTree. 
 
You need to assign the value to the DropdownTree component on Dialog open event. 
 
Please, refer the sample link below. 
 
 
Please let us know, if you need any further assistance. 
 
Regards,  
Sowmiya.


Marked as answer
Loader.
Up arrow icon