Jump to content
delete13

jQuery/Ajax Shopping Cart

Recommended Posts

jQuery / Ajax shopping cart for osCommerce v2.2 RC2a

 

- Fly to Cart product image to cart on product page

- Ajax Add/Remove buttons in cart

- Ajax Delete button in cart

- Ajax Remove button in shopping_cart infobox

- Dynamically refresh of shopping_cart infobox

- Multilanguage support

- Online Demonstration

 

http://addons.oscommerce.com/info/7477

 

Enjoy ;)

Share this post


Link to post
Share on other sites

jQuery / Ajax shopping cart for osCommerce v2.2 RC2a

 

- Fly to Cart product image to cart on product page

- Ajax Add/Remove buttons in cart

- Ajax Delete button in cart

- Ajax Remove button in shopping_cart infobox

- Dynamically refresh of shopping_cart infobox

- Multilanguage support

- Online Demonstration

 

http://addons.oscommerce.com/info/7477

 

Enjoy ;)

 

Wow, congratulations for your contribution, i installed it and it works.

 

Sugestion: paste this thread link in contribution spot so people can feedback here.

 

Observations regarding contribution:

 

A -> When you take out all the items clicking in remove, the total value doesn't update to 0,00.

 

B -> special Portuguese, spanish and other chars after a few clicks get replaced by a question mark in shopping cart:

á -> á

ç -> ç

ã -> ã

 

C -> Doesn't the use of JQuery slow the website, and also, you can't use many JQuery in the same page because the different queries tend to conflict, your opinion regarding this.

 

Very smooth and clean contribution, for a first version, congratulations.

Share this post


Link to post
Share on other sites

B -> special Portuguese, spanish and other chars after a few clicks get replaced by a question mark in shopping cart:

á -> á

ç -> ç

ã -> ã

 

Yes i know that issue, you have to declare the content/type of file when shopping cart is called in AJAX :

 

if ( (int)$_GET['ajax'] != 1 && $_SERVER['HTTP_X_REQUESTED_WITH'] != 'XMLHttpRequest' ) 
{ 
.........
}
else
{
header("Content-Type:text/html; charset=' . CHARSET . '");
} 

Share this post


Link to post
Share on other sites

Yes i know that issue, you have to declare the content/type of file when shopping cart is called in AJAX :

 

if ( (int)$_GET['ajax'] != 1 && $_SERVER['HTTP_X_REQUESTED_WITH'] != 'XMLHttpRequest' ) 
{ 
.........
}
else
{
header("Content-Type:text/html; charset=' . CHARSET . '");
} 

 

Ok, i will implement & feedback... thank you so much!!

 

Congratulations, The contribution works very well and i am going to stick to it, i think the minor disadvantage of not having more jquery features (more then one jquery in same page can sometimes not be optimal) is easily bypassed by this jquery shopping cart advantages.

 

 

I only have the following bugs (and reconfirmed all the installation steps):

 

A - In step 4) of instructions (pdf file)

4) filename : catalog/index.php and other one where placed the shopping cart infobox

 

What do you mean in other one... which files do we have to declare apart catalog/index.php ? (is it contact_us.php, and rest in catalog root?)

 

B - My shopping cart recently is showing this in breadcrumbs and i don't know if it's because this contrib or news blog contrib... Begin>Catalog>NewsBlog instead of Begin>Catalog>Shopping Cart

 

It must be some parameter that is passing incorrectly, because the shopping cart code "seems ok".

 

What can be happening for the nav bar not displaying, and also i get in shopping_cart.php page the following error (not all times)

 

Error!

 

Unable to determine the page link!

 

 

Thanks a lot for your fantastic contribution... and sorry for being a bit annoying with my questions :/

 

Cheers

Share this post


Link to post
Share on other sites

A -> When you take out all the items clicking in remove, the total value doesn't update to 0,00.

Problem corrected by some changes :

 

in boxes/shopping_cart.php look for

  $cart_contents_string = '';

Replace by

  $cart_contents_string = tep_draw_form('boxcart_quantity', tep_href_link(FILENAME_SHOPPING_CART, 'action=update_product'))  ;

 

Update .JS file from the new package http://addons.oscommerce.com/info/7477

Share this post


Link to post
Share on other sites

I am using the contribution jQuery - Ultimate Product Pack (http://addons.oscommerce.com/info/7195) which uses jquery as well.

 

This contribution doesn't seem to work with both contributions installed. Just wondering can jquery only handle one instance or more because the above contribution call for this:

 

<script type="text/javascript" src="js/jquery.js"></script>

<script type="text/javascript" src="js/jquery.prettyPhoto.js"charset="utf-8"></script>

 

<!-- BOC - jQuery Shopping Cart - 11-07-2010 -->

<script type="text/javascript" src="js/jquery-oscart.js"></script>

<!-- EOC - jQuery Shopping Cart - 11-07-2010 -->

 

Anything i done wrong or am i right in saying jquery can call only one thing?

Share this post


Link to post
Share on other sites

I am using the contribution jQuery - Ultimate Product Pack (http://addons.oscommerce.com/info/7195) which uses jquery as well.

 

This contribution doesn't seem to work with both contributions installed. Just wondering can jquery only handle one instance or more because the above contribution call for this:

 

<script type="text/javascript" src="js/jquery.js"></script>

<script type="text/javascript" src="js/jquery.prettyPhoto.js"charset="utf-8"></script>

 

<!-- BOC - jQuery Shopping Cart - 11-07-2010 -->

<script type="text/javascript" src="js/jquery-oscart.js"></script>

<!-- EOC - jQuery Shopping Cart - 11-07-2010 -->

 

Anything i done wrong or am i right in saying jquery can call only one thing?

It is common to have more than one javascript or jquery files referenced on webpages. What you have posted above should not be a problem at all. The conflict would be elsewhere, for example if you had more than one javascript or jquery program on the same page using the same id or class. (as in 'id' or "class" referenced in the html in the webpage) and even that wouldn't necessarily be an issue.

Edited by npn2531

Oscommerce site:

 

 

OSC to CSS, http://addons.oscommerce.com/info/7263 -Mail Manager, http://addons.oscommerce.com/info/8120

Share this post


Link to post
Share on other sites

I really like the fly to cart feature, it is something I have wanted for my shop ever since I saw it on OpenCart. This is worth installing just for that. It really brings the customer's attention to the fact that the item has really been added to the shopping cart without the customer having to leave the page. Thanks!

 

However, when you remove items from the shopping cart using the delete graphic on the shopping cart item line on shopping_cart.php, the shopping cart , and the shopping cart infobox update just fine, except that the price in the shopping cart infobox remains until you refresh the page. Otherwise, this is great and the cart updating without a page refresh is a real user friendly plus feature to add.

Edited by npn2531

Oscommerce site:

 

 

OSC to CSS, http://addons.oscommerce.com/info/7263 -Mail Manager, http://addons.oscommerce.com/info/8120

Share this post


Link to post
Share on other sites

Has anyone installed this contribution and got the flying image to cart working?

 

I have followed all the instructions and the image flying to cart does not work. The cart infobox works fine with the little cross and the Shopping Cart page works fine except for the price not updating until refresh if you remove the item. I am not too concerned with that right now but the flying to cart is not working.

 

I have installed this on a vanilla install of oscommerce rc2.2a hoping if it worked i would upload the affected files to make it easier for people to use a compare program to implement the contribution.

 

Great idea, good work but need help with the flying to cart feature please.

Share this post


Link to post
Share on other sites

Problem corrected by some changes :

 

in boxes/shopping_cart.php look for

  $cart_contents_string = '';

Replace by

  $cart_contents_string = tep_draw_form('boxcart_quantity', tep_href_link(FILENAME_SHOPPING_CART, 'action=update_product'))  ;

 

Update .JS file from the new package http://addons.oscommerce.com/info/7477

 

Hi delete13,

 

Congrats for the best ajax shopping cart i have seen so far, i have sorted the language bug, regarding the replace... shall i just update to your 3rd version or i implement the code you say here?

 

I know this hasn't do to directly to this contrib but if you know i would like some hint... i have SEO Friendly URLs turned off, and still i am getting Unable to determine page links... thanks in advance

Share this post


Link to post
Share on other sites

The third version contain all instructions and solved all problems for those i had a feed back (excepted the CHARSET issue related in this topic)

 

This version supports also products attributes

 

I haven't any feed back about flying problems or "unable to determine page link" issues

 

Because the demonstration URL is in the readme file and regarding my apache logs : this contribution has been downloaded at least 190 times since 3 days ...

Share this post


Link to post
Share on other sites

Is there any way of installing this flying to cart without modifying the standard look of the shopping cart infobox?

Share this post


Link to post
Share on other sites

Is there any way of installing this flying to cart without modifying the standard look of the shopping cart infobox?

 

Please ignore the above post. I think this contribution will not work with jQuery Ultimate Pack (http://addons.oscommerce.com/info/7195) because it creates a thumbnail of a larger image and shows that. Unless the new files in jQuery Ultimate Pack or somewhere else is modified which i would not know how to do.

 

Any help is much appreciated.

Edited by CGhoST

Share this post


Link to post
Share on other sites

Please ignore the above post. I think this contribution will not work with jQuery Ultimate Pack (http://addons.oscommerce.com/info/7195) because it creates a thumbnail of a larger image and shows that. Unless the new files in jQuery Ultimate Pack or somewhere else is modified which i would not know how to do.

 

Any help is much appreciated.

 

Hello,

 

try this. edit /js/jquery-oscart.js and replace each occurence of cart-image-1 by mainimage. I counted 5.

 

I made it work with more pics contribution.

 

Freddy

Edited by oscommerce-ready

Share this post


Link to post
Share on other sites

For jQuery Ultimate Pack, dont't forget to add this piece of code somewhere :

 

<div id="wrapper" style="float:right;"></div>
<span id="pi-product-info" style="display:none"> <?php echo '<a href="' . tep_href_link(FILENAME_PRODUCT_INFO, 'products_id=' . (int)$product_info['products_id']) . '" title="' . $product_info['products_name'] . '">' . $product_info['products_name'] . '</a>' ; ?> </span>

 

Freddy

Share this post


Link to post
Share on other sites

For jQuery Ultimate Pack, dont't forget to add this piece of code somewhere :

 

<div id="wrapper" style="float:right;"></div>
<span id="pi-product-info" style="display:none"> <?php echo '<a href="' . tep_href_link(FILENAME_PRODUCT_INFO, 'products_id=' . (int)$product_info['products_id']) . '" title="' . $product_info['products_name'] . '">' . $product_info['products_name'] . '</a>' ; ?> </span>

 

Freddy

 

This goes in the product_info.php file or in one of the jQuery Ultimate Pack contribution file?

Share this post


Link to post
Share on other sites

This goes in the product_info.php file or in one of the jQuery Ultimate Pack contribution file?

 

This goes in the product_info.php line 224. just before <td>

(from product_info.php contrib file).

 

In my answer, i presume you have activated the option L199 : ADDIMAGES_MENU_LOCATION == 'product_info'

 

otherwise you can add the original id="cart-image-1" in code L240 & L248

 

Freddy.

Share this post


Link to post
Share on other sites

Hello,

 

I don't want to hijack this thread, so i would like you to check the thread i have done regarding a bug i have found after installing this: shopping cart errors

 

Would be nice if you could give a hint on what could be or where the issue.

 

thanks

Share this post


Link to post
Share on other sites

Hello,

 

I don't want to hijack this thread, so i would like you to check the thread i have done regarding a bug i have found after installing this: shopping cart errors

 

Would be nice if you could give a hint on what could be or where the issue.

 

thanks

 

ok delete13 i would like your opinion regarding this... since your probably the best acquainted with your code ... thanks in advance

Share this post


Link to post
Share on other sites

Hi,

Thank you very much for an excellent contribution.

I right now have a Jquery that expands the shopping cart - it's hidden and only appears when called.

Is there a way I could have it like this: http://webresourcesdepot.com/wp-content/uploads/file/jbasket/sliding-basket/

Any help would be much appreciated.

Thank You Very Much!

 

Etes vous de Marseilles? Je suis ne a Marseille... Ah le vieux Port...

Share this post


Link to post
Share on other sites

Bonjour oui je suis de Marseille ;)

 

Your link go to a slidding shopping cart not a flying shopping cart (like in the contribution),

 

The only way is to coding by yourself or to purchase a custom developpement.

Share this post


Link to post
Share on other sites

Feedback: actually the contrib is nice, but if you have also another framework like mootools active needs to use the jQuery instead of $.

 

Besides that i noticed there is something bad in code since it is passing some parameters in wrong way if you have USU5 SEO installed you will know what i mean, the $page parameter isn't being passed right but overall the contrib is ok.

 

Another funny thing one i noticed regarding shopping cart less/more buttons:

 

In Opera Browser: CHARSET & Subtotal near finish order checkout work like charm it even makes the buttons go away while calculating subtotals.

 

In safari and Chrome: CHARSET & Subtotal calc works (but not make the button disappears while calculating)

 

In Internet Explorer: CHARSET works & Subtotal calc near finish order button don't work.

 

In Firefox: CHARSET wears off and doesnt work & Subtotal calc near finish order button works well.

 

It's perhaps because the browsers deal differently with pages with lots of javascript, but notouriously opera is doing better this way.

 

If you know a way to pass $page so the condition

if ( !tep_not_null( $page ) ) is false, and/or if you know what can be done to fix Internet Explore and Firefox share.

 

cheers

Share this post


Link to post
Share on other sites

Bonjour oui je suis de Marseille ;)

 

Your link go to a slidding shopping cart not a flying shopping cart (like in the contribution),

 

The only way is to coding by yourself or to purchase a custom developpement.

 

Merci pour votre reponse!

Je sais que ce que je vous ai envoye n'est pas la meme chose, mais ce que vous avez fait est tres beau et je croyais que d'une maniere ou d'autre c'est plus au moins la meme chose. Je me suis trompe mais ca vous demontre mon ignorance total dans ces sujets...

Vous pensez que c'est possible de faire la meme chose dans oscommerce?

 

j'ai quitte Marseille il y'a plus que trente ans, j'habite aux usa, mais je n'y peut rien ma ville natale aura toujours une place preferre...

chaque fois que je vais a la mer je ne peux m'enpecher de penser aux vieux port ainsi qu'aux boules de petanques!

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×