Change form when typed

Asked

Viewed 82 times

1

I have a page, where I search by name, Cpf or contract and I’m having difficulty changing the size of the form when typing.

I think, when I start typing the characters, already know that it is by name and appears the form of the size x, if I start typing number, check if it is bigger than 6 numbers is Cpf and already inserts the mask when typing and if start typing numbers and is smaller than 11 is contract.

I use this data to search in a query in SQL Server 2012, as per the value entered in input. 

<span style="color: #ffffff"><strong>Contrato:</strong></span>
<input name="inpcont" type="text" required  id="inpcont" placeholder="Buscar..." onBlur="MM_validateForm('inpcont','','RisNum');return document.MM_returnValue" size="08" maxlength="8"/>
<input id="btnBusca" type="image" src="img/lupasemfundo-22x22.png" vspace="0" hspace="0" onclick="index.php.frmbuscacontrato.submit()"/>
html

  • Post the code and what you have tried to do here. Only in the explanation becomes difficult to understand.

  • Good morning Willian, here is the code I use: <form name="frmbuscacontrato" method="post" action="index.php" enctype="Multipart/form-data"> <span style="color: #ffffff"><Strong>Contract:</Strong></span> <input name="inpcont" type="text" id="inpcont" placeholder="Buscar..." onBlur="MM_validateForm('inpcont','','RisNum');return document.MM_returnValue" size="08" maxlength="8"/><input id="btnBusca" type="image" src="img/lupasemfundo-22x22.png" vspace="0" hspace="0" onclick="index.php.frmbuscacontrato.submit()"/>

  • but I need to change to something like: if inpcont is character when typing, changes the size of the form, if when typing in inpcont start typing number, make size check and if it is bigger than 6, it is Cpf and if it is up to 10 is contract and adjust the form

  • Do as I did, edit the question with javascript. Do not put in the comment.

  • 2

    When placing the source code, select it and press the button { } so it comes out formatted.

  • Your doubt is only with the stylization of input? The tags php and sql-server are expendable.

  • I’m new here, but in all the research I’ve done on programming, this is where I found the best answers. For this reason I am grateful to you all from now on.

Show 2 more comments

1 answer

0

You can use the plugin mask from jquery, apply the mask only when the input value is numeric and remove it if you have input from some other character.

$(document).ready(function() {

  $("#nomeCpf").on('keyup', function(e) {

    if ($(this).data('mask') == undefined && $.isNumeric($(this).val())) {
      $(this).mask('000.000.000-00', {
        reverse: false
      });
    } else if($(this).mask) {
      $(this).unmask();
    }
  });

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.0/jquery.mask.js"></script>
<span><strong>Contrato:</strong></span>
<input id="nomeCpf" name="inpcont" type="text" required id="inpcont" placeholder="Buscar..." size="12" />

Browser other questions tagged html

You are not signed in. Login or sign up in order to post.