ASP.NET CORE WITH ANGULAR2 (select2 ) #3071

thobiasxp created 7 years ago

Hi,

am using your inbuilt jq-plugin selectpicker (Directive) , when the array is updated in the component it does't re initialize the selectpicker

4 Answer(s)

0

ismcagdas created 7 years ago
Support Team

Hi,

Can you share your ts and html file contents ?

Thanks.

thobiasxp created 7 years ago

html: its the view..

<div class="row">
                            <div class="col-md-6">
                                <div class="form-group form-md-line-input form-md-floating-label no-hint">
                                    <label>Country</label>
                                    <select #cityCombobox id="yourDropDownElementId" name="city" class="form-control" [(ngModel)]="Selectedcountry" [attr.data-live-search]="true" (change)="doSomethingCountry(Selectedcountry)" jq-plugin="selectpicker" required>
                            <option [value]="SelectedCountryId">{{SelectedCountryName}}</option> 
                            <option *ngFor="let country of countrys" [value]="country.id">{{country.name}}</option> 
                        </select>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group form-md-line-input form-md-floating-label no-hint">
                                    <label>Company</label>
                                    <select #companyCombobox id="yourDropDownElementId" name="type" class="form-control" [(ngModel)]="Selectedcompany" [attr.data-live-search]="true" (change)="doSomethingcompany(Selectedcompany)" jq-plugin="selectpicker" required>
                            <option [value]="SelectedCompanyId">{{SelectedCompanyName}}</option>
                            <option *ngFor="let company of companys" [value]="company.id" >{{company.name}}</option> 
                         </select>

                                </div>

                            </div>

                        </div>

its **ts:**

    companys: Datadto[] = [];
    countrys: Datadto[] = [];

  doSomethingCountry(data): void {
         
         this._select2Service.getCompany(data).subscribe((result) => {
            if (result.select2data != null) {      
             this.companys = result.select2data;             
            this.vale = result.select2data;
           console.log(this.companys);
         } });
       }

this companys array doest updated in html

0

hikalkan created 7 years ago
Support Team

Hi,

You should refresh selectpicker after setting model in the controller, because it can not automatically handle it. You can see an example usage in language edit modal in the project: <a class="postlink" href="https://github.com/aspnetzero/aspnet-zero-core/blob/dev/angular/src/app/admin/languages/create-or-edit-language-modal.component.ts#L43">https://github.com/aspnetzero/aspnet-ze ... ent.ts#L43</a>
0

thobiasxp created 7 years ago

Hi,

Thanks, now its working..

Have an answer to this question? Log in and write your answer.