Ajax Listener - how does it work?
Moderator: General Moderators
-
simonmlewis
- DevNet Master
- Posts: 4435
- Joined: Wed Oct 08, 2008 3:39 pm
- Location: United Kingdom
- Contact:
Re: Ajax Listener - how does it work?
I have tried to put that listener code at the end of that PHP code. But I don't see how that tells the screen/page to show the current amount.
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
All the best from the United Kingdom.
-
simonmlewis
- DevNet Master
- Posts: 4435
- Joined: Wed Oct 08, 2008 3:39 pm
- Location: United Kingdom
- Contact:
Re: Ajax Listener - how does it work?
Any further info on this please?
I know there are ways to make content from a database that changes, 'change' on screen, so how do you do it?
I know there are ways to make content from a database that changes, 'change' on screen, so how do you do it?
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
All the best from the United Kingdom.
-
simonmlewis
- DevNet Master
- Posts: 4435
- Joined: Wed Oct 08, 2008 3:39 pm
- Location: United Kingdom
- Contact:
Re: Ajax Listener - how does it work?
Hi all.
So this subject had been raised again by someone I work with.
We add an item to a cart, which is a database table. But they can "Continue Shopping", which just closes the popup, but the "items in cart" doesn't change.
I still don't know how to make that automatically update via AJAX without a page turning over.
I've seen it does in many places. Like Facebook's (1) when you have a new notification in the top right. Or flickr, when you get a new email, a '1' in a red box popups up.
How is this achieved, bearing in mind it has to be checking a database to do it.
So this subject had been raised again by someone I work with.
We add an item to a cart, which is a database table. But they can "Continue Shopping", which just closes the popup, but the "items in cart" doesn't change.
I still don't know how to make that automatically update via AJAX without a page turning over.
I've seen it does in many places. Like Facebook's (1) when you have a new notification in the top right. Or flickr, when you get a new email, a '1' in a red box popups up.
How is this achieved, bearing in mind it has to be checking a database to do it.
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
All the best from the United Kingdom.
-
simonmlewis
- DevNet Master
- Posts: 4435
- Joined: Wed Oct 08, 2008 3:39 pm
- Location: United Kingdom
- Contact:
Re: Ajax Listener - how does it work?
Celauran wrote:Contrived example, but assume shopping cart markup like this. Yes, yours is likely more detailed, has a trolley icon, etc. Doesn't matter.You have your event listener attached to your "Add item to cart" buttons. Have the script that updates the DB also return the count of items in the user's cart. The success callback can then use that return value to update the markup above.Code: Select all
<div id="shopping_cart"> <span class="count">2</span> </div>Code: Select all
$('.add_to_cart').click(function() { // Collect data $.ajax({ url: "some_file.php", type: "POST", data: whatever, success: function(data, status, request) { var cart_count = data; $('#shopping_cart .count').html(cart_count); } }); });
Code: Select all
<script>
function precheck(str)
{
if (str=="")
{
document.getElementById("txtHint").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("srcHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","/ajax_addtocart.php?q="+str,true);
xmlhttp.send();
}
success: function(data, status, request) {
var cart_count = data;
$('#shopping_cart .count').html(cart_count);
}
</script>Code: Select all
<?php
<div id='shopping_cart'>
<span class='count'></span>
</div>
?>Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
All the best from the United Kingdom.
Re: Ajax Listener - how does it work?
You're trying to assign the success parameter of the object you're passing to jQuery's .ajax method, except you aren't calling jQuery's .ajax method and are setting an object parameter outside of an object so that's not going to work. Are you using jQuery? You could get rid of that entire block of JS you've got there and pretty much drop in the code I provided, just replacing a few placeholders with actual data.
-
simonmlewis
- DevNet Master
- Posts: 4435
- Joined: Wed Oct 08, 2008 3:39 pm
- Location: United Kingdom
- Contact:
Re: Ajax Listener - how does it work?
I cannot change the code of what works, since I have been paid to make that happen.
Can I alter your code to make it do as described?
Can I alter your code to make it do as described?
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
All the best from the United Kingdom.
Re: Ajax Listener - how does it work?
Of course. I've already described what needs to happen; fire off a request, return the new item count, update the DOM accordingly.
-
simonmlewis
- DevNet Master
- Posts: 4435
- Joined: Wed Oct 08, 2008 3:39 pm
- Location: United Kingdom
- Contact:
Re: Ajax Listener - how does it work?
Ok look, I'm dumb with this. As you say, of course it can be done with my existing code, but please... how?! You can see I have tried, but I am getting nowhere with it.
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
All the best from the United Kingdom.