EvhenDemchenko / FrontTZ

Front-End technical task
1 stars 0 forks source link

Структура формы ввода VIN-кода #1

Open avtopro opened 1 year ago

avtopro commented 1 year ago

Для создания форм очень желательно использовать HTML-элемент <form>. Это правильно с точки зрения семантики HTML и гораздо удобнее, потому что:

См. https://developer.mozilla.org/en-US/docs/Learn/Forms/How_to_structure_a_web_form#the_form_element

Кроме того, важно чтобы у <input> был соответствующий его назначению атрибут name, например name="vin", благодаря этому браузер сможет автоматически предложить варианты по автозаполнению поля.

https://github.com/EvhenDemchenko/FrontTZ/blob/bc05f6b89b6a6f7554afd2bd3ae48bdf1525eac9/src/components/Navigation.tsx#L55-L77

EvhenDemchenko commented 1 year ago

Доброго времени суток , очень признателен за вашу обратную связь . Хотелось бы узнать ожидать ли обратной связи по вакансии front-end junior / trainee , просто мне очень интересно то чем я занимаюсь и я ищу любую возможность для получения реального опыта , в связи с этим я был бы рад сотрудничать с вами на любых условиях , спасибо.

пт, 3 мар. 2023 г. в 22:24, Avto.pro @.***>:

Для создания форм очень желательно использовать HTML-элемент

. Это правильно с точки зрения семантики HTML и гораздо удобнее, потому что:

  • На десктопе автоматически работает отправка формы по нажатию на Enter (используем не onClick на кнопке, а onSubmit на форме), не надо добавлять клавиатурные обработчики.
  • На мобилке могут появляться дополнительные кнопки для отправки формы, зависит от системы.
  • Проще настраивать валидацию, автозаполнение и т. п.

См. https://developer.mozilla.org/en-US/docs/Learn/Forms/How_to_structure_a_web_form#the_form_element

Кроме того, важно чтобы у был соответствующий его назначению атрибут name, например name="vin", благодаря этому браузер сможет автоматически предложить варианты по автозаполнению поля.

https://github.com/EvhenDemchenko/FrontTZ/blob/bc05f6b89b6a6f7554afd2bd3ae48bdf1525eac9/src/components/Navigation.tsx#L55-L77

— Reply to this email directly, view it on GitHub https://github.com/EvhenDemchenko/FrontTZ/issues/1, or unsubscribe https://github.com/notifications/unsubscribe-auth/AWXF44BWKGR3Y3SE5ZENPXDW2JHODANCNFSM6AAAAAAVPA3MAU . You are receiving this because you are subscribed to this thread.Message ID: @.***>