Jump to content

Ajax Add To Basket - No Page Reload


Guest itrends

Recommended Posts

Guest itrends

Hey all!

Finally going to move from version 3 to version 4. While I am at it I am going to change my skin and develop a new one.

At the moment you have to view a products page

Then you click the "buy" button

The page reloads and adds the item to the cart

I want to know how I can make it so that

You view a category (the list of products)

You click on the buy button

The page DOES NOT reload

The item gets added to the cart

A pop up or something says "the item was added to the cart".

How would I go about doing this? Ajax?

The reason is that users are going to be buying many small parts and it is very un-intuative to have to go into the details page of each product, click add, go back out and then repeat for every item them want.

I look forward to any help that can be offered.

Regards,

David

Link to comment
Share on other sites

Guest itrends

Thank you. I had been looking at that yesterday but can't say I am really good enough to work out how to implement it.

Any help would be amazing but I understand if not :sourcerer:

Link to comment
Share on other sites

I've done it in testing, and it will probably be included in the 4.2 release. It's mega slick. :ph34r:

Take a look at this store:

http://www.accu-products.com/ Note that it's a LIVE store, so don't muck around with placing orders unless you intend to pay. (he's a friend who likes cool stuff...hence the AJAX test :ninja: )

:sourcerer:

Link to comment
Share on other sites

Guest itrends

just looked at that site in safari. The page still reloads when you click add to cart. I am thinking I can actually do this with a javascript alert and iframes unless you know of anyone I can pay to do a mod?

Link to comment
Share on other sites

Personally, I think that it is better to 'alert' customers that a product has been added. A page refresh does that (it's what people expect). If you want to use AJAX, I would suggest that you notify the customer that the item has been added (perhaps via a on-screen notification).

Link to comment
Share on other sites

I looked at jQuery, but found that I didn't need it as CC4 already uses the script.aculo.us libraries.

The site I listed doesn't currently indicate items added. I have another that does. There are more things to add, but it's not something due for release yet, so it's not 100%. I was mainly indicating that it could be done. I've got the AJAX code running on my personal site as well and it does flash the cart when an item is added. It does this by alternating a given object between existing and alternate styles. So you can go as subtle or extreme as you like.

As for Safari support, I don't have a Mac, so I have no way to test it. Sorry if it's not kosher there.

:)

Link to comment
Share on other sites

Guest Brivtech

That is what I want to do (alert on screen) but I don't know how to do any of this :)

You need to add in a simple alert tagges onto the form that handles the add to basket function to achieve this. Do a Google search for "checks whether the user has filled in text fields and prints out the values the user filled in", and you can customise it to your needs.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...