Adding form validators for donation form.
This commit is contained in:
		
							parent
							
								
									018e95e648
								
							
						
					
					
						commit
						6a8deff706
					
				@ -73,14 +73,16 @@
 | 
			
		||||
          </div>
 | 
			
		||||
          <input formControlName="amount" class="form-control" type="number" min="0.001" step="1E-03">
 | 
			
		||||
        </div>
 | 
			
		||||
        <div class="input-group mb-4" *ngIf="donationForm.get('amount').value >= 0.01; else lowAmount">
 | 
			
		||||
        <div class="input-group" *ngIf="donationForm.get('amount').value >= 0.01; else lowAmount">
 | 
			
		||||
          <div class="input-group-prepend" style="width: 42px;">
 | 
			
		||||
            <span class="input-group-text">@</span>
 | 
			
		||||
          </div>
 | 
			
		||||
          <input formControlName="handle" class="form-control" type="text" placeholder="Twitter handle (Optional)">
 | 
			
		||||
        </div>
 | 
			
		||||
        <div class="input-group">
 | 
			
		||||
          <button class="btn btn-primary mx-auto" type="submit">Request invoice</button>
 | 
			
		||||
        <div class="required" *ngIf="donationForm.get('amount').hasError('required')">Amount required</div>
 | 
			
		||||
        <div class="required" *ngIf="donationForm.get('amount').hasError('min')">Minimum amount is 0.001 BTC</div>
 | 
			
		||||
        <div class="input-group mt-4">
 | 
			
		||||
          <button class="btn btn-primary mx-auto" type="submit" [disabled]="donationForm.invalid">Request invoice</button>
 | 
			
		||||
        </div>
 | 
			
		||||
      </form>
 | 
			
		||||
    </div>
 | 
			
		||||
 | 
			
		||||
@ -27,3 +27,9 @@
 | 
			
		||||
.info-group {
 | 
			
		||||
  max-width: 400px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
.required {
 | 
			
		||||
  color: #FF0000;
 | 
			
		||||
  font-weight: bold;
 | 
			
		||||
}
 | 
			
		||||
@ -3,7 +3,7 @@ import { WebsocketService } from '../../services/websocket.service';
 | 
			
		||||
import { SeoService } from 'src/app/services/seo.service';
 | 
			
		||||
import { StateService } from 'src/app/services/state.service';
 | 
			
		||||
import { Observable } from 'rxjs';
 | 
			
		||||
import { FormBuilder, FormGroup } from '@angular/forms';
 | 
			
		||||
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 | 
			
		||||
import { ApiService } from 'src/app/services/api.service';
 | 
			
		||||
import { env } from '../../app.constants';
 | 
			
		||||
import { DomSanitizer, SafeUrl } from '@angular/platform-browser';
 | 
			
		||||
@ -39,7 +39,7 @@ export class AboutComponent implements OnInit {
 | 
			
		||||
    this.websocketService.want(['blocks']);
 | 
			
		||||
 | 
			
		||||
    this.donationForm = this.formBuilder.group({
 | 
			
		||||
      amount: [0.01],
 | 
			
		||||
      amount: [0.01, [Validators.min(0.001), Validators.required]],
 | 
			
		||||
      handle: [''],
 | 
			
		||||
    });
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user