Show / hide submit button

Question

METHODOLOGICAL?

show the submit button only if one or two of the required entries are filled with a value but if you delete the necessary values, submit should disappear.

need to do using the keyboard. any idea?

Answer 1

The function below should help you:

$(function(){
    // Hide submit button if either field is empty
    $('form input').keyup(function(){
        if($('#input1').val() == "" || $('input2').val() == ""){
            $('#submit').hide();
        }
        else {
            $('#submit').show();
        }
    });
    // Don't submit form if either field is empty
    $('form').submit(function(){
    if($('#1').val() == "" || $('#2').val() == ""){
        return false;
    }
    });
});

By the way, you will need to use CSS ( display:none) to hide your submit button.

Answer 2

. , , . :

    $('#formNode').keyup(function(e){
            var invalid = false;
            $(this).children().each(function(i,child){  
                if(($(child).attr("isReq") == "true") 
                    && child.value.length == 0
                ){
                    invalid = true;
                }   
            });
            $("#submitButton")[invalid ? "hide" : "show"]();
});   




    <form id="formNode">
            <input type="text" isReq="true"/>
        <input type="text" isReq="true"/>
        <input type="text" isReq="true"/>
        <input type="submit" value="Submit" style="display:none" id="submitButton"/>
    </form>

, , node, isReq, script .

Answer 3

Without a link in basic javascript:

<input type="text" id="input-1" onkeyup="submitChange();" />

<input type="text" id="input-2" onkeyup="submitChange();" />

<input type="submit" id="submit" style="display: none;" />

<script type="text/javascript">

inputOne = document.getElementById("input-1"); 
inputTwo = document.getElementById("input-2"); 
inputSubmit = document.getElementById("submit"); 

function submitChange()
{
     if(inputOne.value == "" || inputTwo.value == "")
     {
          inputSubmit.style.display = "none";
     }
     else
     {
          inputSubmit.style.display = "block";
     }
}

</script>

Answer 4

$('#inputid').keyup(function() {
    if ($(this).val().length > 0) {
       $('#submitbutton').show();
    } else {
       $('#submitbutton').hide();
    }
});

for several:

$('#inputid1,#inputid2, etc...').keyup(function() {
   var hidden = false;
   $('#inputid1,#inputid2, etc...').each(function() {
      if ($(this).val().length == 0) {
          hidden = true;
      }
   })
   if (hidden) {
      $('#submitbutton').hide();
   } else {
      $('#submitbutton').show();
   }

});

Answer 5

Why not take a look at onblur.

onblur event

The onblur event occurs when an object loses focus.