Auto-fill input in a form (php, html)

1

I have a simple form with the following text fields: name, post, mobile and email. I want to make the 'email' field fill in the 'name' field automatically as follows: for example, if the 'name' field is filled in with 'José da Silva' the 'email' field would fill automatically and in real time with "[email protected]". What is the simplest way to get there?

My form:

    <form name="formulaio" method="post" action="<?=$PHP_SELF?>"> 
        <label>
            <span>Nome:</span>
            <input type="text" name="nome" /><br>
        </label>
        <label>
            <span>Cargo:</span>
            <input type="text" name="cargo" /><br>
        </label>
        <label>
            <span>Celular:</span>
            <input type="text" name="celular" /><br>
        </label>

        <label>
            <span>e-mail:</span>
            <input type="text" name="email" /><br>
        </label>
        <input type="hidden" name="acao" value="enviar" />
        <button type="submit" class="envio" title="Enviar"></button> 
    </form>
    
asked by anonymous 22.06.2014 / 05:20

2 answers

4

The simplest way would be to use jQuery.

Something like:

$( "input[name=nome]").change(function() {
  var nome      = $(this).val();
  var pEspaco   = nome.indexOf(' ');
  var nomeFinal = nome;
  if(pEspaco != -1){
    nomeFinal = nome.substr(0, pEspaco);
  }
  $( "input[name=email]").val( nomeFinal + "@dominio.com.br");
});

Note that we are expecting the change in input with name name . When a change event occurs we store the name in a variable and look for the first whitespace. We also define a variable called nomeFinal , if there is a blank we cut the string to the space. And finally we set the value of input with name email to nomeFinal + uma string .

    
22.06.2014 / 05:50
2

From what I understand, you want the field to be populated automatically through the browser / browser autocomplete features, which already have a data pattern filled in earlier, and make it easier to fill out the Form, correct?

The solution is simple, if this is the case:

  • Just add the property autocomplete="on"

Example:

<input type="text" name="nome" autocomplete="on" />
    
28.08.2014 / 07:23