Execute ajax function when the user press 5 times his keyboard

Question

I want to execute an ajax function. This ajax function have to be executed if and only if the user press 5 times his keyboard.

Im using Jquery for the ajax request.

I try this but it still not working :

// What i tried to do 
$("#num_cppap").keypress(function(event){
if (event.which == 5){
// The AJAX function
$( "#num_cppap" )
       .focusout(function() {
        var numCppap = $(this).val();
        var isBizarre = false;
        var searchBy5Chars = false;
        if(numCppap.length > 0) {
            if(numCppap.length == 5){
                searchBy5Chars = true;
                $.ajax({
                    type : "POST",
                    url : '/gestion/gestDepot/ajaxrecherchecppap',
                    async : false,
                    dataType : 'json',
                    data : {
                        'num_publication' : numCppap,
                        'isBizarre' : isBizarre,
                        'searchBy5Chars' : searchBy5Chars
                    },
                    success : function(publication) {
                        if ($.isEmptyObject(publication)) {
                            resetTitreDepot('num_cppap');
                            alert('Le numéro de CPPAP ne correpond à aucun contrat.');
                        } else {
                            $(this).dialog('close');
                            $("#noPublicationCPPAP").hide();

                            gestionTitreDepot(publication);
                        }

                   }
                 });
             }
         } 
        else {
            resetTitreDepot('num_cppap');
        }
    })
    }
    else {
        alert('you stupid');
    }
});

If you have some documentations or something to help me, it would be very nice !

Thank you for your attention !

Answer 1

You can create a variable like var number=0;, and inside the keypress function you increase it: number++;

Then put the code you'd like to run inside the following if statement:

if(number==5){...}

This means every time you press a key, the number will increase, and once it reaches 5, the code inside if(number==5){...} will run.

Here's a basic example:

$(function(){
var number=0;
$("#text").on("keypress",function(){
number++;
if(number==5){
alert("Pressed 5 times!");
}
});
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" placeholder="Write 5 characters here" id="text">

Or if you want it to run every time keys have been pressed 5 times, you can just replace if(number==5) with if(number%5==0)

$(function(){
var number=0;
$("#text").on("keypress",function(){
number++;
if(number%5==0){
alert("Pressed 5 times!");
}
});
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" placeholder="Write 5 characters here" id="text">

You can implement this method in your function too, before the ajax call, write this: if(number==5) or if(number%5==0). Then the ajax will only run if any key has been pressed 5 times.