dev #14607 Море. Правки по сайту: set cursor position at beginning of date input on focus

This commit is contained in:
nikolay 2023-07-05 15:25:58 +04:00
parent 73de9ea6b7
commit eb15e47328
2 changed files with 42 additions and 29 deletions

View File

@ -1,31 +1,31 @@
<ng-container *ngIf="!authService.loading"> <ng-container *ngIf="!authService.loading">
<form <form
(ngSubmit)="submit()" (ngSubmit)="submit()"
[formGroup]="form" [formGroup]="form"
> >
<div class="container center"> <div class="container center">
<div class="form"> <div class="form">
<h1>Регистрация</h1> <h1>Регистрация</h1>
<mat-form-field appearance="outline"> <mat-form-field appearance="outline">
<mat-label>Ваше имя</mat-label> <mat-label>Ваше имя</mat-label>
<input formControlName="name" matInput type="text" /> <input formControlName="name" matInput type="text" />
</mat-form-field> </mat-form-field>
<mat-form-field appearance="outline"> <mat-form-field appearance="outline">
<mat-label>Пол</mat-label> <mat-label>Пол</mat-label>
<mat-select formControlName="sex"> <mat-select formControlName="sex">
<mat-option value="0">Не выбран</mat-option> <mat-option value="0">Не выбран</mat-option>
<mat-option value="1">Мужчина</mat-option> <mat-option value="1">Мужчина</mat-option>
<mat-option value="2">Женщина</mat-option> <mat-option value="2">Женщина</mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<mat-form-field appearance="outline"> <mat-form-field appearance="outline">
<mat-label>Дата рождения</mat-label> <mat-label>Дата рождения</mat-label>
<input formControlName="date" matInput [textMask]="mask" type="text" inputmode="numeric"> <input (click)="focusHandler($event)" (blur)="blurHandler()" formControlName="date" matInput [textMask]="mask" type="text" inputmode="numeric">
</mat-form-field> </mat-form-field>
<button mat-raised-button color="primary">Зарегистрироваться</button> <button mat-raised-button color="primary">Зарегистрироваться</button>
</div>
</div> </div>
</div> </form>
</form>
</ng-container> </ng-container>
<ng-container *ngIf="authService.loading"> <ng-container *ngIf="authService.loading">

View File

@ -1,4 +1,4 @@
import { Component, OnInit } from "@angular/core"; import { Component } from "@angular/core";
import { FormControl, FormGroup, Validators } from "@angular/forms"; import { FormControl, FormGroup, Validators } from "@angular/forms";
import { MessageService } from "primeng/api"; import { MessageService } from "primeng/api";
import { AuthService } from "src/app/services/auth.service"; import { AuthService } from "src/app/services/auth.service";
@ -9,7 +9,7 @@ import moment from 'moment';
templateUrl: './create_user.component.html', templateUrl: './create_user.component.html',
styleUrls: ['./create_user.component.scss'], styleUrls: ['./create_user.component.scss'],
}) })
export class CreateUserComponent implements OnInit { export class CreateUserComponent {
public form = new FormGroup({ public form = new FormGroup({
name: new FormControl('', [Validators.required]), name: new FormControl('', [Validators.required]),
sex: new FormControl('', [Validators.required]), sex: new FormControl('', [Validators.required]),
@ -27,7 +27,20 @@ export class CreateUserComponent implements OnInit {
private messageService: MessageService, private messageService: MessageService,
) { } ) { }
ngOnInit() { } focused = false;
focusHandler(e: any) {
if (!this.focused) {
e.target.blur();
e.target.setSelectionRange(0, 0);
this.focused = true;
e.target.focus();
}
}
blurHandler() {
this.focused = false;
}
submit() { submit() {
if (this.form.invalid) { if (this.form.invalid) {