Project

General

Profile

« Previous | Next » 

Revision 60820

Added by Konstantinos Triantafyllou over 2 years ago

[Library | Trunk]: contact us change organization type to select

View differences:

modules/uoa-services-library/trunk/ng-openaire-library/src/app/contact-us/contact-us.component.html
54 54 
    </div>
55 55 
    <div *ngIf="contactForm.get('organizationType')" class="uk-width-1-2@s uk-margin-medium-top">
56 56 
        <h6 class="uk-text-bold uk-margin-small-bottom">Organization Type <span class="uk-text-danger uk-text-bold">*</span></h6>
57 
        <input type="text" class="uk-input uk-width-1-1" placeholder="Your Organization Type" formControlName="organizationType"
58 
               [class.uk-form-danger]="contactForm.get('organizationType').invalid && contactForm.get('organizationType').touched"
59 
               [matAutocomplete]="auto">
60 
        <mat-autocomplete #auto="matAutocomplete">
61 
            <mat-option *ngFor="let option of autoCompleteTypes | async" [value]="option">
62 
                {{option}}
63 
            </mat-option>
64 
        </mat-autocomplete>
57 
        <select class="uk-select uk-width-1-1" formControlName="organizationType">
58 
            <option [value]="''" hidden selected>Select your organization type</option>
59 
            <option *ngFor="let option of organizationTypes" [value]="option">{{option}}</option>
60 
        </select>
65 61 
    </div>
66 62 
    <div *ngIf="contactForm.get('subject')" class="uk-width-1-1@s uk-margin-medium-top">
67 63 
        <h6 class="uk-text-bold uk-margin-small-bottom">Subject <span class="uk-text-danger uk-text-bold">*</span></h6>
modules/uoa-services-library/trunk/ng-openaire-library/src/app/contact-us/contact-us.component.ts
10 10 
  styleUrls: ['contact-us.component.css']
11 11 
})
12 12 

  		




  13
  
  
    
export class ContactUsComponent implements OnInit {


  		




  
  13
  
    
export class ContactUsComponent {


  		




  14
  14
  
    
  @Input()


  		




  15
  15
  
    
  public contactForm: FormGroup;


  		




  16
  16
  
    
  @Input() formTitle: string;


  		




  ......




  23
  23
  
    
  public right: boolean = true;


  		




  24
  24
  
    
  @Input()


  		




  25
  25
  
    
  public buttonClass: string;


  		




  26
  
  
    
  public autoCompleteTypes: Observable<string[]>;


  		




  27
  26
  
    
  


  		




  28
  
  
    
  constructor() {


  		




  29
  
  
    
  }


  		




  30
  
  
    
  


  		




  31
  
  
    
  ngOnInit() {


  		




  32
  
  
    
    if(this.contactForm.get('organizationType')) {


  		




  33
  
  
    
      this.autoCompleteTypes = this.contactForm.get('organizationType').valueChanges


  		




  34
  
  
    
        .pipe(


  		




  35
  
  
    
          startWith(''),


  		




  36
  
  
    
          map(value => this._filter(value))


  		




  37
  
  
    
        );


  		




  38
  
  
    
    }


  		




  39
  
  
    
  }


  		




  40
  
  
    
  


  		




  41
  
  
    
  private _filter(value: string): string[] {


  		




  42
  
  
    
    const filterValue = value.toLowerCase();


  		




  43
  
  
    
    return this.organizationTypes.filter(option => option.toLowerCase().includes(filterValue));


  		




  44
  
  
    
  }


  		




  45
  
  
    
  


  		




  46
  27
  
    
  public send() {


  		




  47
  28
  
    
    this.sendEmitter.emit({


  		




  48
  29
  
    
      valid: this.contactForm.valid


  		












Also available in:  Unified diff