Submit Otp Without Page Refresh

i want to Click on the Submit That Send Otp to my Phone or Email im not Really Familiar With Ajax Can any one Explain how to do it on this Html :

<input type="submit" value="OTP code " name="Otp" id="Otp" autocomplete="off">

1 answer

  • answered 2019-12-09 14:14 Alon Pini

    The easier way is to use jQuery.ajax. If you aren't familiar with jQuery, jQuery is a JavaScript framework that makes JavaScript coding much easier and faster, especially for beginners.

    More information about jQuery.ajax: jQuery.ajax() by jQuery.com

    JavaScript Code:

    $('#Opt').on('click', function(e){
        e.preventDefault();
    
        $.ajax({
            url: 'target.php',
            success: function(data){
                //any code to handle "data" received from target.php
            }
        });
    });
    

    What we did in this example, is:

    • selecting the button element by the ID name - $('#Opt')
    • adding "click" event to the button - on('click', function...
    • preventing the form to submit and refresh the page - e.PreventDefault()
    • using jQuery ajax function to send request to target.php - $.ajax({...
    • setting up ajax options, for example, target page by using url: 'target.php'
    • creating a function which will handle the response - success: function(){...

    In the success function you should add any code that you want to run as soon as the request is finished successfully. the data var will contain the response from the server (in this case, the target.php response).