ali ak ali ak - 2 months ago 7
Ajax Question

My javascript code not working

My javascript code not working I dont get any errors but When I click submit button nothing happens I am fallowing a video tutorial I have watched twice but I cant find out what is wrong here

This is index.php

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
function gonder() {
// $('#sonuc').html("bekle");
$ajax({
type:"post",
url:"ajax.php",
data:$('ferman').serialize(),
success:function (msg) {
$('#sonuc').html(msg);

}

});
}

</script>
</head>
<body>
<form id="ferman">

<input type="text" name="ad" >
<input type="text" name="soyad" >
<input type="button" value="gonder" onclick="gonder();">
</form>
<div id="sonuc"></div>
</body>
</html>


this is ajax.php

<?php

$ad=$_POST["ad"];
$soyad=$_POST["soyad"];
echo "ad $ad soyadınız $soyad";
?>

Answer

It seems the main problem is here:

Fix

$('ferman').serialize(),

to

$('#ferman').serialize(),

It's just simple mistake, really nothing to explain, considering that you used # id selector correctly on #sonuc.

function gonder() {
//   $('#sonuc').html("bekle");
     $.ajax({
         type:"post",
         url:"ajax.php",
         data:$('#ferman').serialize(),
         success:function (msg) {
             $('#sonuc').html(msg);
         }
    });
}

Update: As squint mentioned in the comments, and I missed it, there is a missing . in ajax call, should be $.ajax. Thanks to squint to point that out anyway.

Note: There is no need to change input type from button to submit while we are making an ajax call.

Cheers :)