problem of event blur with submit button

Question

problem of event blur with submit button

Navigation

#1 by (1 votes)

0

Good afternoon, I have a form, it has a text field that triggers the event .blur that takes the name entered and returns an id with ajax, takes the id saved in another input hidden, the problem is that the event only blur is triggered if I click empty place (to lose the focus) and then the submit button, if I click directly on the submit the blur event is not triggered, any solution to such a problem? I already tried switching to event change but it also did not work if I directly clicked on submit.

 $("#responsavel").blur(function(){var cdgResp  = $("#responsavel").val();$.post("controller/responsavel.php",  {nomeResponsavel:cdgResp} , function(idResp) {if (idResp != false){$("#idResponsavel").val(idResp); }else { $("#idResponsavel").val("0"); } });});

above is the javascript that fires blur

<form action="javascript:func()" method="post">action="javascript:func()" method="post"><input id="responsavel" type="text" name="responsavel" value=<?php echo $dados['responsavel']; ?>"><input id="idResponsavel" type="hidden" name="idResponsavel" value="<?php echo $dados['idResponsavel']; ?>"><input type="submit" value="enviar"></form>

and above this the form, I have now created a generic form to better exemplify, the data is already filled with php but if you change the name of the field responsible would have to change the id of it.

javascript jquery onblur

asked by anonymous 11.04.2018 / 21:13

1 answer

How to map return of a Value Object with Dapper? Request sent more than once when selecting a form field

score 1 · Answer 1

Use the:

keyup

(click run to see an example)

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><script>$(document).ready(function(){$("input").keydown(function(){
        $("input").css("background-color", "yellow");
        
    });
    $("input").keyup(function(){
        $("input").css("background-color", "pink");
        $("#resposta").append("<br>Requisitando...");
        setTimeout(function(){ $("#resposta").empty(); }, 500);
        
        //aqui ficará seu ajax...Sempre buscando por um id...
        //Utilize um loading, para travar o botao submit, 
        //até a requisição terminar, dura menos de um segundo
         
    });
});
</script>
</head>
<body>

Nome digitado: <input type="text">
<div id="resposta"></div>
<br><br><br>
<p>Digite uma letra. Toda vez que ele ficar YELLOW e voltar para o PINK, um evento irá verificar e retornar o ID.</p>

</body>
</html>