Techdive
Techdive

Reputation: 1043

How to reset the ng-multiselect-dropdown

I want to reset the ng-multiselect-dropdown. Is it necessary to put it in a form ?

code -

app.component.html

<div>
  <p id = "node">Select a Root API Object - </p>
  <p style="width:50%">
    <ng-multiselect-dropdown [placeholder]="'Select Root API Object'" [data]="dropdownListRoot" [(ngModel)]="selectedItemsRoot" [settings]="dropdownSettingsRoot"
      (onSelect)="onItemSelectRoot($event)" (onSelectAll)="onSelectAllRoot($event)">
    </ng-multiselect-dropdown>

  </p>
</div>

app.component.ts

 export class HierarchySearchComponent implements OnInit {

 onItemSelectRoot(item: any) {
    this.onlyRootItemSelect = true;  // for cypher also.


    console.log(item); 
    this.rootItem = item;
    this.nodeSelect = true;

    this.rootItemText = this.rootItem.item_text;
    console.log("this.rootItemText = ", this.rootItemText);

  }


  onSelectAllRoot(items: any) {
    console.log("On Item select all" + items);
    this.nodeSelect = true;
  }

}

Upvotes: 6

Views: 24892

Answers (3)

Rams
Rams

Reputation: 2179

if you are using formControlName instead of ngModel then you can use something like this

this.myForm.get(formControlName).setValue([]);

Upvotes: 2

Abidh
Abidh

Reputation: 467

it is not necessary to put it in form. Just make the selectedItemsRoot array empty. Call this function resetSelection() from the element/context. if you are using the button to clear selection, it can be

.html

`<button (click)="resetSelection()" >clear</button>`

.ts

resetSelection() {
this.selectedItemsRoot = [];        
}

Upvotes: 5

Phobos
Phobos

Reputation: 1646

It is not necessary to put it in a form - if you want to clear the selected items, just set the selectedItemsRoot object to an empty array. I.e.

clearSelection() {
    this.selecteditemsRoot = [];
}

And bind that function to a button, or call it with any other method you are using to clear the selection.

Upvotes: 3

Related Questions