This ajax can't give me a result. I'm struggling with this issue. I don't know why and I couldn't find where is the mistake. I was tried another ajax and it works, but i don't know with this one. How's this? somebody help me, thanks.
ztest1.php:
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<style></style>
<script>
function checkemail() {
var status = document.getElementById("emailudahada");
var u = document.getElementById("email").value;
if (u != "") {
document.getElementById("email").style.backgroundColor = "yellow";
status.innerHTML = "<img src='/img/loading.GIF'></img>";
$.ajax({
url: '/ztest2.php',
type: "POST",
data: ({
email: u,
cekemailsignup: 'yes'
}),
success: function(result) {
status.innerHTML = result['result'] + "," + result['cekemailsignup'] + "," + result['email'];
}
});
} else {
document.getElementById("email").style.backgroundColor = "white";
}
}
</script>
</head>
<body>
<div id='emailudahada'></div>
<input type='text' id='email' onblur='checkemail()'></input>
</body>
</html>
ztest2.php:
<?php
include('ckcon.php');
$cekemailsignup=isset($_REQUEST['cekemailsignup'])?$_REQUEST['cekemailsignup']:null;
if($cekemailsignup=='yes'){
$email=isset($_REQUEST['email'])?$_REQUEST['email']:null;
$q=mysql_query("SELECT COUNT(email) AS ce FROM t_un WHERE email='$email' LIMIT 1");
$f=mysql_fetch_object($q);
$ce=$f->ce;
if($email==null){
$result="<img src='/img/xred.png'></img> <font color='red'>Cant be null value</font>";
}
if(strlen($email) < 4){
$result="<img src='/img/xred.png'></img> <font color='red'>4 digit at minimum</font>";
}
if(is_numeric($email[0])){
$result="<img src='/img/xred.png'></img> <font color='red'>1st character must be letter</font>";
}
if($ce<>0){
//$result="<img src='/img/xred.png'></img> <font color='red'><strong>".$email."</strong> is taken</font>";
$result="kampret lu";
}
echo "
cekemailsignup=$cekemailsignup<br>
email=$email<br>
ce=$ce<br>
result=$result<br>
";
$ar = array(
'result' => $result,
'cekemailsignup' => $cekemailsignup,
'email' => $email
);
echo json_encode($ar);
}
?>
result
is string, to use it like object you need to parse it to JSON.
var obj = JSON.parse(result);
You can also set dataType: 'json',
in the $.ajax
configuration options to set it by default and then you don't need to parse the response, it can be directly used.
As jQuery is included on page, use it for DOM manipulation.
Complete Code:
$('#email').on('blur', function() {
var $status = $('#emailudahada');
email = $.trim($(this).val());
if (email) {
$(this).css('backgroundColor', 'yellow');
$status.html('<img src=\'/img/loading.GIF\'></img>');
$.ajax({
url: '/ztest2.php',
type: 'POST',
dataType: 'json',
data: ({
email: email,
cekemailsignup: 'yes'
}),
success: function(result) {
$status.html(result.result + ',' + result.cekemailsignup. + ',' + result.email);
}
});
} else {
$(this).css('backgroundColor', 'white');
}
});
Here is changed js function
<script>
function checkemail() {
var status = document.getElementById("emailudahada");
var u = document.getElementById("email").value;
if (u != "") {
document.getElementById("email").style.backgroundColor = "yellow";
status.innerHTML = "<img src='/img/loading.GIF'></img>";
$.ajax({
url: '/ztest2.php',
type: "POST",
dataType: "json", //need to tell that response will as json
data: ({
email: u,
cekemailsignup: 'yes'
}),
success: function(result) {
status.innerHTML = result.result + "," + result.cekemailsignup. + "," + result.email;
}
});
} else {
document.getElementById("email").style.backgroundColor = "white";
}
}
</script>
HTML File
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<style>
</style>
<script>
function checkemail(){
var status = document.getElementById("emailudahada");
var u = document.getElementById("email").value;
if(u != ""){
document.getElementById("email").style.backgroundColor = "yellow";
status.innerHTML = "<img src='/img/loading.GIF'></img>";
$.ajax({
url: '/ztest2.php',
type: "POST",
data: ({
email: u,
cekemailsignup: 'yes'
}),
success :
function(result2){
var result = JSON.parse(result2);
status.innerHTML=result['result']+","+result['cekemailsignup']+","+result['email'];
}
});
}else{
document.getElementById("email").style.backgroundColor = "white";
}
}
</script>
</head>
<body>
<div id='emailudahada'></div>
<input type='text' id='email' onblur='checkemail()'></input>
</body>
PHP file (ztest2.php)
<?php
$ar = array(
'result' => "123",
'cekemailsignup' => "true",
'email' => "ririnputrian@gmail.com"
);
echo json_encode($ar);
?>
</div>