I've only found a couple of tutorials that show this but as I am new to Jquery, every time I try to follow I get something wrong down the line and I have no idea what I am doing or what anything does.
Here is my HTML + JS code:
Code:
<!DOCTYPE html>
<html>
<head>
<title>AJAX</title>
<link rel='stylesheet' type='text/css' href='style.css' />
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("form#submit").submit(function() {
var textdata = $('#textdata').attr('value');
$.ajax({
type: "POST",
url: "db.php",
data: "textdata="+ textdata,
success: function(){
$('div.success').fadeIn();
});
}
});
return false;
});
});
</script>
</head>
<body>
<div id='content'>
<form id='submit' method='post'>
<fieldset>
<legend>Enter some information</legend>
<input type='text' name='textdata' />
<input type='submit' value='submit' />
</fieldset>
</form>
<div id='success' style='display:none;'>Data Updated</div>
</div>
</body>
</html>
And the PHP in db.php
PHP Code:
<?php
// MYSQL Connection:
mysql_connect("localhost", "root");
mysql_select_db("test");
//------------------
mysql_query("UPDATE test SET text = '".$_POST['textdata']."' WHERE id = 1") OR die(mysql_error());
?>
I'm not sure what the problem is, but the page seems to refresh everytime I click submit?
Before you post, read our: 
