Нови атрибути на формите в HTML5

HTML5 има няколко нови атрибута за елемента <form> и за <input>.

Новите атрибути за елемента <form>:

• autocomplete
• novalidate

Новите атрибути за елемента <input>:

• autocomplete
• autofocus
• form
• formaction
• formenctype
• formmethod
• formnovalidate
• formtarget

Атрибута autocomplete за <form> и <input>

Атрибута autocomplete определя дали формата или input полето трябва да е способно да изпълни функцията autocomplete или не.

Когато на autocomplete е разрешено да изпълни функцията, браузъра автоматично попълва стойностите базирано на стойностите които потребителя е въвеждал преди.

Съвет: Възможно е да разрешите функцията autocomplete да се изпълни за <form> и да забраните изпълнението му за input поле.

Атрибута autocomplete работи с <form> и следните видове <input> : text,search,url,tel,email,password,datepickers,range и color.

Пример

HTML форма с разрешен autocomplete и забранен за едно input поле:

<form action="demo_form.asp" autocomplete="on">
  Вашето име:<input type="text" name="fname"><br>
  Вашата фамилия: <input type="text" name="lname"><br>
  Електронна поща: <input type="email" name="email" autocomplete="off"><br>
  <input type="submit">
</form>

В този пример <input type="email"> е със забранен autocomplete и няма да бъде попълнено автоматично за разлика от другите две полета

Съвет: В някои браузъри може да се налага да активирате функцията предварително за да работи.

Атрибута novalidate за <form>

Атрибута novalidate е булев атрибут.

Когато е зададен, той определя, че form-data (input) няма нужда от валидиране за да бъде изпратена.

Пример

Индикира, че формата няма нужда от валидиране за да бъде изпратена:

<form action="demo_form.asp" novalidate>
  Електронна поща: <input type="email" name="user_email">
  <input type="submit">
</form>

Атрибута autofocus за <input>

Атрибута autofocus е булев атрибут.

Когато е зададен, той определя, че <input> елемента трябва автоматично да се фокусира когато страницата зареди.

Пример

Позволява на input полето "Вашето име" автоматично да се фокусира когато страницата зареди:

Вашето име:<input type="text" name="fname" autofocus>

Атрибута formaction за <input>

Атрибута formaction задава URL адреса на файл който ще поеме input контрола когато формата бъде изпратена.

Атрибута formaction заменя атрибута action на елемента <form>.

Атрибута formaction се използва заедно с type="sumbit" и type="image".

Пример

An HTML form with two submit buttons, with different actions:

<form action="demo_form.asp">
  Вашето име: <input type="text" name="fname"><br>
  Вашата фамилия: <input type="text" name="lname"><br>
  <input type="submit" value="Submit"><br>
  <input type="submit" formaction="demo_admin.asp"
  value="Submit as admin">
</form>

Атрибута formenctype за <input>

Атрибута formenctype определя как данните от формата да бъдат кодирани когато се изпратят на сървъра (само за форми които използват метода - post)

Атрибута formenctype заменя атрибута enctype на елемента <form>.

Атрибута formenctype се използва заедно с type="sumbit" и type="image".

Пример

<form action="demo_post_enctype.asp" method="post">
  Вашето име: <input type="text" name="fname"><br>
  <input type="submit" value="Submit">
  <input type="submit" formenctype="multipart/form-data"
  value="Submit as Multipart/form-data">
</form>

Атрибута formmethod за <input>

Атрибута formmethod определя HTTP метода за изпращане на данните от формата към action URL.

Атрибута formmethod заменя атрибута method на елемента <form>.

Атрибута formmethod може да се използва с type="sumbit" и type="image".

Пример

<form action="demo_form.asp" method="get">
  Вашето име: <input type="text" name="fname"><br>
  Вашата фамилия: <input type="text" name="lname"><br>
  <input type="submit" value="Submit">
  <input type="submit" formmethod="post" formaction="demo_post.asp"
  value="Submit using POST">
</form>

Атрибута formnovalidate за <input>

Атрибута novalidate е булев атрибут.

Когато се зададе, той определя, че <input> елемента не трябва да бъде валидиран когато се изпраща.

Атрибута formnovalidate заменя novalidate атрибута на елемента <form>.

Атрибута formnovalidate може да се използва с type="submit".

Пример

<form action="demo_form.asp">
  Електронна поща: <input type="email" name="userid"><br>
  <input type="submit" value="Submit"><br>
  <input type="submit" formnovalidate value="Submit without validation">
</form>

Атрибута formtarget за <input>

Атрибута formtarget определя име или ключова дума която индикира кога да бъде показан отговора след изпращане на формата.

Атрибута formtarget заменя атрибута target на елемента <form>.

Атрибута formtarget може да се използва с type="submit" и type="image".

Пример

<form action="demo_form.asp">
  Вашето име: <input type="text" name="fname"><br>
  Вашата фамилия: <input type="text" name="lname"><br>
  <input type="submit" value="Submit as normal">
  <input type="submit" formtarget="_blank"
  value="Submit to a new window">
</form>

Прочетете и Част 2 на урока!