Hello
I have this script
<div id = "add">
Add as friend
</div>
<script>
jQuery("#add").click(function () {
$.ajax({
type: "POST",
url: "data.php",
});
});
</script>
When the div is clicked in it, it will proccess data.php in real-time and add some data into the database.
I want to do a few things.
- Check if the data has been added into the database successfully.
- Change the div contents in real-time if it has been a success.
- Add a new div notifying the user of the success.
How would I go about doing this?
You will need to add a success handler to the jQuery Ajax configuration options, e.g.
$.ajax({
url: 'data.php',
success: function( data ) {
//do something with the data
}
});
Let’s say data.php does some stuff and then sends you back a JSON or XML document - whatever it is you return should get passed back in to the “data” variable. You can then do stuff with that.
Hi, thank you for your response.
How would I modify/add new using ‘success:’
I’m new to javascript, sorry.
If you’re very new to JavaScript, it’s probably a good idea to find some tutorials to read up on and get a good grip on the base language before diving headfirst in to jQuery.
To answer your question though:
Let’s say your data variable that you returned has a propery called “content”, you could inject that into the “add” div with something like this:
$("#add").html(data.content);