Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

material_select multiple problem after reset #449

Open
GnRSlash opened this issue Apr 14, 2020 · 0 comments
Open

material_select multiple problem after reset #449

GnRSlash opened this issue Apr 14, 2020 · 0 comments

Comments

@GnRSlash
Copy link

GnRSlash commented Apr 14, 2020

I am using Angular 8 with angular2-materialize (0.100.2) and I have a dropdown with multiple options. I am using reactive forms and everything is ok except after a form reset or submit.
The dropdown resets and checkboxes stay unchecked, but when I try to check one of the checkbox that was previously selected before reset, is starts to act inverted (checkbox is selected but form value is not, and when checkbox is not selected, form value is!)

This is the select html part:

      <div #divReWorkType class="input-field col s5" (click)="stopProp($event);">
        <select #cboReWorkType materialize="material_select" multiple
           name="ReWorkType" id="ReWorkType" formControlName="ReWorkType">
          <option disabled hidden>Escolha uma opção</option>
          <option *ngFor="let item of this.refservice.ReWorkTypeStatusItems.Items;" [value]="item.ID">
            {{ item.Descr }}
          </option>
        </select>
      </div>

This is the reset button html:

<input #btnReset type="reset" class="btn" [value]="'Limpar'"
          (click)="hideModal('');">

This is my form:

  createForm() {
    // create the html form with fields and validators
    this.grupo = {
      PVOP: [this.reworkData.Rewo_PVOP, [Validators.required, Validators.minLength(6), Validators.maxLength(11)]]
      , Qtde: [this.reworkData.Rewo_Qtde, [Validators.required, Validators.min(1), Validators.maxLength(3)]]
      , ReWorkType: [this.reworkData.ReWorkTypeUIDs]
    };

    this.refservice.ReWorkTypeStatusItems.Items.forEach(idArea => {
      const txt = this.getAlteracaoByID(idArea.ID);
      this.grupo['alt' + idArea.ID] = [txt];
    });

    this.formulario = this.formBuilder.group(this.grupo);

  }

And this is the hidemodal function:

  hideModal(statusMnemonic: string) {
    this.formulario.reset();
    this.userAction.emit(statusMnemonic);
  }
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant