quarta-feira, 13 de junho de 2018

Definir o foco de um campo em um formulário ao carregar página

Algumas coisas simples tornam um sistema muito prático e sofisticado.

Uma coisa simples é definir o foco de um campo em um formulário ao carregar página, evitando que o usuário precise clicar neste campo para iniciar a digitação dos valores, por exemplo, ao preencher um cadastro.

Vamos ver como fazer isso de forma bastante simples com JavaScript:

Primeiro, acrescente o código de chamada da função na tag inicial da body da página onde o formulário será carregado, que ficará assim:

<body onLoad="setFocus()">

Agora, dentro desta página, coloque a função seguinte:

<script type="text/javascript">
function setFocus() {
  document.getElementById("campoComFoco").focus();
}
</script>

A função define que o campo do formulário que receber o id campoComFoco será o que receberá o foco quando a página for carregada.

Exemplo de um formulário e um campo definido para receber a função setFocus:

<form method="post" action="#">
   <input type="text" name="produto" id="campoComFoco">
   <button type="submit">Consultar</button>

</form>

É isso!

Nenhum comentário:

Postar um comentário