How can I use ajax success data

Question

It's form validate checker. How can i add ajax success message. after all validation I want to show success message like "Your successfully signup";

jQuery(function ($) {
    $('#username').blur(function(e) {
        var username = $('#username').val();
        $.ajax({
            type: 'POST',
            //url: 'http://localhost/stateway/user-signup/?username=' + username,
            url: 'http://localhost/blue_bucket/signup/?username=' + username,
            success: function (response) {
                $("#responseusername").html(response);
            }
        });
        e.preventDefault();
    });

    $('#email').blur(function(e) {
        var email = $('#email').val();
        $.ajax({
            type: 'POST',
            //url: 'http://localhost/stateway/user-signup/?email=' + email,
            url: 'http://localhost/blue_bucket/signup/?email=' + email,
            success: function (response) {
                $("#responseemail").html(response);
            }
        });
        e.preventDefault();
    });
});

`$("#myForm").on("submit", function(){` ? I've never seen a signup form that works on `blur`, did you? You cannot match an `email` not knowing a password, and a user could fill-in an email first, right? — Roko C. Buljan, Apr 30 '17 at 14:10
@RokoC.Buljan I think the idea is to check if the username and email entered are already taken, not to log the person in, or create an account for them — Rory McCrossan, Apr 30 '17 at 14:27
@sam000123 : what about suggested answers ? I believe your acceptance record is really questionable. Any of those past questions solved ? If so, it'd be best to mark them as solved, so that people know, and it's saved for the records. UV and accepting good answers is also part of the SO Q/A system. — OldPadawan, Apr 30 '17 at 17:10

score 0 · Answer 1 · answered Apr 30 '17 at 14:28

It's simple. You can use Javascript alert method or you can append success message to a div on DOM or something like.

and the thing is

When you are creating a AJAX Request if the request is made then it will go and hit your server side code. if the code successfully executed what you want to do. then echo 'signup success' and to show this message to your user simply just change this $("#responseemail").html(response); to this alert(response) and you are done.. ! I hope this will help you :)

score 0 · Answer 2 · edited May 23 '17 at 12:10

IF the idea is to check whether an email or username is already registered (ie: for a mailing list), then the following will help you.

Keep in mind that you should not trust user's data from inputs, therefore, on the PHP part, in order to match form data against DB, you should really consider using PPS : Prepared Parameterized Statements. This will help Preventing SQL injection

-> HTML + jQuery part (with jQuery library on top) :

-> you can check everything in the jQuery manual -> jQuery.post()

<div id="samplediv"></div> <!-- will handle answer -->

<script type="text/javascript">

$(document).ready( function() {

$("#regbutton").click(function(e){
     e.preventDefault();

          var email = $('#email').val();
          var username = $('#username').val();
          $.ajax({
           url: "register.php",
           method: "POST",
           data: "email="+email+"&username="+username,
           success: function(data){
             // if PHP response is OK we show it
             $("#samplediv").html(''+data'');
            },
            error: function (request, status, error) {
            alert(request.responseText);
            }
          });
         });
});
</script>

<form action="#" id="form" method="post">
<p><input type="text" name="email" id="email" value="" /> email</p>
<p><input type="text" name="username" id="username" value="" /> username</p>
<input type="submit" id="regbutton" value="GO" />
</form>

-> On the PHP part (register.php):

<?php

error_reporting(E_ALL); ini_set('display_errors', 1);

$email = $_POST['email'];
$username = $_POST['username'];

// make all checking on user's data + match against DB here, if success ->

echo"Your successfully signup"; // else error : change message using PHP answer

?>

How can I use ajax success data

2 Answers2