Autocomplete Reactive form

UI Components for Angular
Post Reply
RajVision
Posts: 1
Joined: 13 Mar 2020, 22:37

13 Mar 2020, 22:47

On submit I need get only 'lookupvalue' instead of '{lookupname: "ANN LRAMIREZ", lookupvalue: "ar7660"}'. How can I do that? I am using the reactive form in a model.

{ssaid: 0, behalfuid: {lookupname: "ANN LRAMIREZ", lookupvalue: "ar7660"}}

<ng-template #template>
<div class="modal-header">
<h4 class="modal-title">Behalf Form</h4>
<button type="button" class="close pull-right" aria-label="Close" (click)="modalRef.hide()">
<span aria-hidden="true">&times;</span>
</button>
</div>
<form [formGroup]="editBehalfForm" (ngSubmit)="updateBehalf()">
<input class="form-control" type="hidden" formControlName="ssaid" />
<div class="modal-boy">
<div class="container">
<div class="form-group">
<label for="behalfuid">Behalf ATTUID</label>
<!-- <input placeholder="Behalf ATTUID" id="behalfuid" class="form-control" type="text"
formControlName="behalfuid" /> -->
<p-autoComplete formControlName="behalfuid" placeholder="Behalf ATTUID" id="behalfuid" [suggestions]="lookupsResult" (completeMethod)="search($event)" [minLength]="2" dataKey="lookupvalue" field="lookupvalue" [forceSelection]="true">
<ng-template let-lookup pTemplate="item">
{{lookup.lookupname}}
</ng-template>
<ng-template let-lookup pTemplate="selectedItem">
{{lookup.lookupvalue}}
</ng-template>
</p-autoComplete>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" (click)="modalRef.hide()">Close</button>
<button [disabled]="!editBehalfForm.valid || !editBehalfForm.dirty" type="submit"
class="btn btn-primary">Submit</button>
</div>
</form>
</ng-template>

search(event) {
// this.lookupsResult = this.lookups.filter(c => c.name.startsWith(event.query));
this.lookupService.getAttuidLookup(event.query).toPromise().then(data => {
this.lookupsResult = data;
});
}

updateBehalf() {
if (this.editBehalfForm.valid) {
this.modalRef.hide();
this.userssa = Object.assign({}, this.editBehalfForm.value);
this.userssaService
.updateSsa(this.userssa)
.subscribe(
next => {
this.redirectTo('/account/userssa/');
}, error => {
this.alertify.error(error);
}, () => {
this.redirectTo('/account/userssa/');
});
}
}

Post Reply

Return to “PrimeNG”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 26 guests