Submit form without button. Only when input is completed

Asked

Viewed 86 times

-1

So guys, I’d like to know how to send a form without submit button or without clicking something. I saw on a site a input where after filling with a value, it from Submit in the form.

I tried to do the same but could not. I want it to send when the form when the number of characters of the input is greater than five.

Detail: no form there’s only one input to enter the value, this way:

<script>
    (document).ready(function(){
      $('#campo').on('input', function(){
        $('#campo').prop('submit', $(this).val().length < 3);
      });
    });
</script>

<label>Campo:</label>
    <input id="campo" type="text" maxlength="3">
    ...

2 answers

1

Just create a role for the event oninput to check if the size of the input is greater than five and submit the form. See the code below:

function checksInput() {
    const input = document.getElementById("code");
    const form = document.getElementById("myForm");

    if (input.value.length > 5) {
        form.submit();
    }
}

document.getElementById("code").oninput = checksInput;
<form id="myForm">
    <input id="code" placeholder="Digite o código do produto"/>
</form>

  • length > 4, as it starts from 0... 0,1,2,3,4 (5)

  • In his case it is length > 5 because he wants the input to be larger than five.

  • then all right :D

0

Hello, had the answer above with pure Javascript, I’ll leave an example with jQuery too, only in case I chose to leave the condition equal to 5 pq then sends only the 5 characters:

$(() => {
  $('#campo').on('input', function() {
    if($(this).val().length == 5) $('form').submit()
  })
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<form>
  <label>Campo:</label>
  <input id="campo" type="text">
</form>

Browser other questions tagged

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