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

Trigger onSubmit() when i click on ngx-multiselect to select an option #226

Open
yogeshkumar36 opened this issue Jun 27, 2023 · 0 comments

Comments

@yogeshkumar36
Copy link

yogeshkumar36 commented Jun 27, 2023

i have a form [formGroup]="form" (ngSubmit)="onSubmit()", in which there are multiple input fields and ngx-multiselect. When i click on ngx-multiselect it triggered the onSubmit function of form.
Here is the code:

<form [formGroup]="form" (ngSubmit)="onSubmit()">
	<div class="row">             
		<div class="col-md-12 sideborder">
			<div class="row">
				<div class="col-md-12 mb-3">
					<label>Membership Type <span class="field_required">*</span></label>
					<input type="text" formControlName="name"
						[ngClass]="{'is-invalid': submitted && f['name'].errors}" [(ngModel)]="pageModel.name"
						ngModel class="form-control" placeholder="">
				</div>
				<div class="col-md-12 mb-3">
					<label>Membership Card Image</label>
					<span data-bs-toggle="modal" id="1" (click)="showpopup($event)" data-bs-target="#memberModal"><i class="fa fa-question-circle" aria-hidden="true" id="1"></i></span>
					<span class="field_required">*</span>
					<div>
						<img [src]="wallet_bannerContent" class="img-fluid" width="100">
					</div>
					<input type="file" formControlName="wallet_bannerContent"  (change)="UploadImage($event , 'memberType')"
						[ngClass]="{'is-invalid': submitted && f['wallet_bannerContent'].errors}"
						[(ngModel)]="pageModel.wallet_bannerContent" ngModel class="form-control" placeholder="">
					<label><b>Max file size 100 kb</b></label>
					<em class="notification">Note : Dimension of Membership Banner: Height <b>650px</b> and width <b>780px</b></em>
				</div>
				<div class="col-md-12 mb-3">
					<label>Select reciprocals applicable to this Membership Type <span
							class="field_required">*</span></label>
					<ngx-multiselect 
						[(ngModel)]="selectedSequence"
						[options]="getreciprocaldropdown"
						[showHelperElements]="false">
					</ngx-multiselect>
				</div>
				<div class="col-md-12 mb-3">
					<label>Membership Reciprocal Text <span class="field_required">*</span></label>
					<span data-bs-toggle="modal" id="2" (click)="showpopup($event)" data-bs-target="#memberModal"><i class="fa fa-question-circle" aria-hidden="true" id="2"></i></span>
					<input type="text" formControlName="roamLogoText"
						[ngClass]="{'is-invalid': submitted && f['roamLogoText'].errors}"
						[(ngModel)]="pageModel.roamLogoText" ngModel class="form-control" placeholder="">
				</div>
			</div>
			<div class="row">
				<div class="col-md-12 mb-3">
					<div class="buttonfooter">
						<button class="bluebtn" *ngIf="id === 0 || id === undefined">
							<span *ngIf="isLoading" class="bluebtn mr-1"></span>
							Submit
							<span></span><span></span><span></span><span></span>
						</button>
					</div>
				</div>
			</div>
		</div>
			
		</div>
</form>

Thanks

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