jQuery/Ajax Mini Cart for osCommerce 2.3.3

[Dr. Rolex]

jQuery/Ajax Mini Cart for osCommerce 2.3.3

 

- Support thread -

 

Download Add-On here: http://addons.oscommerce.com/info/8908

Edited September 14, 2013 by Dr. Rolex

[kleon]

Hi

May be you can upload screenshot ?

Thanks

[kleon]

Sorry! finded

[♥Tsimi]

Hi

 

First of, THANK YOU for this great, good looking Add-On.

After i successfully installed this Add-On i'm facing a strange problem.

When i'm using Chrome Browser (ver. 30.0.1599.101) the border of the popup window appears double with two different border-radius and color. But with Internet Explorer 10 and Firefox (ver. 14.0.1) everything looks fine.

It's a bit difficult to explain so i took some sample pictures to show what i mean.

 

Chrome Browser

 

http://imageshack.us/a/img811/6000/6uqs.jpg

 

Firefox Browser and IE10 Browser

 

http://imageshack.us/a/img201/2258/n6ql.jpg

 

 

What might be the cause of that?

 

Thanks & regards

Tsimi

Edited October 23, 2013 by Tsimi

[Dr. Rolex]

Hi

 

First of, THANK YOU for this great, good looking Add-On.

After i successfully installed this Add-On i'm facing a strange problem.

When i'm using Chrome Browser (ver. 30.0.1599.101) the border of the popup window appears double with two different border-radius and color. But with Internet Explorer 10 and Firefox (ver. 14.0.1) everything looks fine.

It's a bit difficult to explain so i took some sample pictures to show what i mean.

 

Chrome Browser

 

http://imageshack.us/a/img811/6000/6uqs.jpg

 

Firefox Browser and IE10 Browser

 

http://imageshack.us/a/img201/2258/n6ql.jpg

 

 

What might be the cause of that?

 

Thanks & regards

Tsimi

 

Hello Mr. Tsimi,

 

The cause is probably that some idiot who dare call himself a Doctor have tried to program CSS. :P

 

I can't reproduce this error in any of my browsers, but the first thing I would do would be to comment out all the border properties between the /* Ajax Mini Cart */ tags in ./stylesheet.css to see if you can find a culprit.

 

It could also be that the CSS settings from another Add-On is overlapping with this one. Look for settings for the following classes in your stylesheets.

.ui-dialog .ui-widget .ui-widget-content .ui-corner-all .ui-front .ajax_cart

 

If you find border-properties, then comment them out as well and then test.

 

If you want you can PM me the address to your shop and I'll have a look at it.

Edited October 25, 2013 by Dr. Rolex

[♥Tsimi]

The cause is probably that some idiot who dare call himself a Doctor have tried to program CSS. :P

 

:D you did really a great job in this one. :thumbsup:

 

I can't reproduce this error in any of my browsers, but the first thing I would do would be to comment out all the border properties between the /* Ajax Mini Cart */ tags in ./stylesheet.css to see if you can find a culprit.

 

i'll do that. maybe i can narrow it down.

 

It could also be that the CSS settings from another Add-On is overlapping with this one. Look for settings for the following classes in your stylesheets.

.ui-dialog .ui-widget .ui-widget-content .ui-corner-all .ui-front .ajax_cart

 

i don't have other add-ons in it, its a clean installation. to test add-ons i always try them on new installed osCommerce shops to see how they look and work.

 

If you want you can PM me the address to your shop and I'll have a look at it.

 

i'd love to but i don't have a live shop yet only local installations running on xampp.

 

i also tried to put the small jquery cart icon in the header so that customers could mouseover it and klick to see the contents of the shopping cart but i'm having

trouble to do that. the icon is in place but the "klick me to see" text is not multilingual and somehow if i try to change the amount of an item it won't load/update the amount and new price. ex. 1 item $60, 2 items should be $120 but it doens't do that if i put it inside the header. if i try it in the shopping cart header it works like a charm.

my target would be to have a cart in the header which is no problem to do and your cart icon next to it so that customers could get more detail info on the items in the cart. i'll keep trying....i'm not a coder or programmer so my steps forward are small but eventually the'll get me to the target. ^_^

 

thanks again and regards

tsimi

 

p.s. please don't call me mr. i feel so old when people do that. just Tsimi or Lambros is ok. ;)

[Dr. Rolex]

i'd love to but i don't have a live shop yet only local installations running on xampp.

 

i also tried to put the small jquery cart icon in the header so that customers could mouseover it and klick to see the contents of the shopping cart but i'm having

trouble to do that. the icon is in place but the "klick me to see" text is not multilingual and somehow if i try to change the amount of an item it won't load/update the amount and new price. ex. 1 item $60, 2 items should be $120 but it doens't do that if i put it inside the header. if i try it in the shopping cart header it works like a charm.

my target would be to have a cart in the header which is no problem to do and your cart icon next to it so that customers could get more detail info on the items in the cart. i'll keep trying....i'm not a coder or programmer so my steps forward are small but eventually the'll get me to the target. ^_^

 

thanks again and regards

tsimi

 

p.s. please don't call me mr. i feel so old when people do that. just Tsimi or Lambros is ok. ;)

 

Greetings Lambros,

 

I'm not a native English speaker. I'm just using mr./sir/whatever because I think it sounds funny. And well, if it's really you on your avatar you look more like 30?

 

It was a while I "fiddled" with this Add-On and I don't use it myself so my memory isn't fresh on how it works. But on the other hand my memory hasn't been freshed since the last time I remember, which i don't. (w00t)

Too much moral depravation I guess, but since I never recieved a handbook like the ancient Egypts did I never learned right from wrong, ha ha.

 

the icon is in place but the "klick me to see" text is not multilingual

Looking at the code now, the Tooltips should be multilingual. If we are talking about the same thing this is the code from the shopping cart:

$data = '<div class="ui-widget infoBoxContainer">' .
		 ' <div class="ui-widget-header infoBoxHeading ajax_cart_init" title="' . TOOLTIP_MIN_CART . '"><a href="' . tep_href_link(FILENAME_SHOPPING_CART) . '">' . MODULE_BOXES_SHOPPING_CART_BOX_TITLE . '</a><span id="ajax_cart_init" class="ui-button-icon-primary ui-icon ui-icon-cart"></span><div style="clear:both;"></div></div>' .
		 ' ' . $cart_contents_string .
		 '</div>';

 

Add a definition to TOOLTIP_MIN_CART to every languages and there will be no problem.

 

Oops, I can see now that step 3 in the manual is incorrect.

Find the code in the instructions and replace it with:

echo tep_draw_button(HEADER_TITLE_CART_CONTENTS . '<span id="headercart">' . ($cart->count_contents() > 0 ? ' (' . $cart->count_contents() . ')' : '') . '</span>', 'cart', tep_href_link(FILENAME_SHOPPING_CART)) .

 

But this is not enough. The Add-On worked for me when I uploaded it, perhaps I forgot to write some instructions and I'm sorry Lambros but I don't have enough time currently to work it out. :(

There also seems to be missing images?

 

The plus.png moins.png etc. can be found in the jQuery/Ajax Shopping Cart 2.3.3 package but it won't help to get this Add-On working again.

 

I wonder why nobody have mentioned this before, if I got some complaint right away I would have fixed it in an instant. Really sorry, but I almost promise to get back to this when I have time again and find the solution because it can't be that hard.

 

The problem is that it posts to shopping_cart.php when it should post to ajax_cart.php. You might find a way yourself or perhaps someone else could be a little bit less selfish and give help (....).

 

I don't like leaving it like this when this is my responsibility, but I have no choice this time.. Too much work, too little time.. :sweating:

[♥Tsimi]

Hi Doc

 

I'm not a native English speaker. I'm just using mr./sir/whatever because I think it sounds funny.

 

Perhaps French? or from a French speaking country? Since French people tend to use Monsieur very often. and because of the plus.png, moins.png.

If yes, merci beaucoup pour votre aide et votre temps.

 

And well, if it's really you on your avatar you look more like 30?

 

click my avatar.... ;)

 

It was a while I "fiddled" with this Add-On and I don't use it myself so my memory isn't fresh on how it works. But on the other hand my memory hasn't been freshed since the last time I remember, which i don't. (w00t)

Too much moral depravation I guess, but since I never recieved a handbook like the ancient Egypts did I never learned right from wrong, ha ha.

 

hahaha... :lol:

 

But this is not enough. The Add-On worked for me when I uploaded it, perhaps I forgot to write some instructions and I'm sorry Lambros but I don't have enough time currently to work it out. :(

 

There also seems to be missing images?

 

The plus.png moins.png etc. can be found in the jQuery/Ajax Shopping Cart 2.3.3 package but it won't help to get this Add-On working again.

 

I wonder why nobody have mentioned this before, if I got some complaint right away I would have fixed it in an instant. Really sorry, but I almost promise to get back to this when I have time again and find the solution because it can't be that hard.

 

The problem is that it posts to shopping_cart.php when it should post to ajax_cart.php. You might find a way yourself or perhaps someone else could be a little bit less selfish and give help (....).

 

I don't like leaving it like this when this is my responsibility, but I have no choice this time.. Too much work, too little time.. :sweating:

 

first, you created THE most nice, good looking and easy to follow installation manual. love it! the black background and separation, very nice.

I know to well what you mean, and therefore appreciate very much that you take the time to help me out here.

I'm currently trying to install other add-ons and they are giving me headache too, well one got solved with the help from burt.

but still many others to go...and after that many more....again thank you very much and i'll keep trying. like i mentioned i don't have a live store running yet so i still got a bit time to play around with the code and perhaps make it work as i like it.

 

Lambros

[Dr. Rolex]

Hi Doc

 

 

 

Perhaps French? or from a French speaking country? Since French people tend to use Monsieur very often. and because of the plus.png, moins.png.

If yes, merci beaucoup pour votre aide et votre temps.

 

 

 

click my avatar.... ;)

 

 

 

hahaha... :lol:

 

 

 

first, you created THE most nice, good looking and easy to follow installation manual. love it! the black background and separation, very nice.

I know to well what you mean, and therefore appreciate very much that you take the time to help me out here.

I'm currently trying to install other add-ons and they are giving me headache too, well one got solved with the help from burt.

but still many others to go...and after that many more....again thank you very much and i'll keep trying. like i mentioned i don't have a live store running yet so i still got a bit time to play around with the code and perhaps make it work as i like it.

 

Lambros

 

Haha, no I'm Swedish and here we never use titles, only exception is the royal family (I think).. That's probably why I think they sound funny. It could be both ways of course..

 

Well, that's the only way to learn. There are no short cuts (probably soon, though) to get an increased mass of knowledge, but once you do understand one piece, you will understand others too.

 

I don't know your age, but I guess you... no I am assuming you're older than me because else I might be in trouble.

Just repeat, fail. Repeat, fail. I love to fail because then I might learn something new.

 

Anyway, when I was I guess around 10-15 years old the only computer "handbooks" that existed did always include one single picture and that was of that evil fu-k (the Author) who always seemed to give an evil grim thinking "You'll never finish this book you idiot, look at me, just go away..".. Another problem was most if not all books in libraries was 5-10 years outdated.

 

Well, this is an easy fix, I'm sure of it. But I'm going on vacation this Sunday and I have so much to do. But understand the problem, The jQuery sends post to some page who answers with wrong content, at least I experienced that. That usually mean that you are sending your POST to the wrong page.. Look it up in the NET tab in Chrome.

 

I'm quite exhausted now, so I will once again leave to what hope will be a hour sleep. Good night!

[♥Tsimi]

I found the solution to that chrome browser problem! (w00t)

when using chrome browser, everytime i click "any" input field in the shop a yellow outline/frame appeard.

this doesn't happen in firefox or ie10.

So i searched in google and found a guy that had this problem:

 

How do I stop Chrome from yellowing my site's input boxes?

 

i didn't think that this would be related to the pop-up window problem too but i just gave it a try and it worked!

you just need to add

 

outline-style: none;

 

to the .ajax_cart class inside the stylesheet and the stupid double borders disappear!

now the pop-up window looks same, as it was meant to be, in all 3 browsers. (firefox, chrome, ie10)

 

tak!

Edited November 7, 2013 by Tsimi

[Psytanium]

I have 2.3.1 installed, can i have some instructions ?

 

After a failed struggle to make it run, i have replaced all you files over mine. and it didn't worked. <_<

[Dr. Rolex]

I have 2.3.1 installed, can i have some instructions ?

 

After a failed struggle to make it run, i have replaced all you files over mine. and it didn't worked. <_<

 

I jumped straight from 2.2 to 2.3.3 so I don't know what the difference between 2.3.1 and 2.3.3 are, do you?

 

Anyway, the simplest way should be to update your shop to 2.3.3, it shouldn't be too much of a hassle since you're already on 2.3.1.

 

Best regards,

Dr. Rolex

[Dr. Rolex]

I found the solution to that chrome browser problem! (w00t)

when using chrome browser, everytime i click "any" input field in the shop a yellow outline/frame appeard.

this doesn't happen in firefox or ie10.

So i searched in google and found a guy that had this problem:

 

How do I stop Chrome from yellowing my site's input boxes?

 

i didn't think that this would be related to the pop-up window problem too but i just gave it a try and it worked!

you just need to add

 

outline-style: none;

 

to the .ajax_cart class inside the stylesheet and the stupid double borders disappear!

now the pop-up window looks same, as it was meant to be, in all 3 browsers. (firefox, chrome, ie10)

 

tak!

 

Glad you worked it out. CSS can be a real mess to get right. Most of the Add-Ons I have developed have almost always taken more time from me than the actual functions..

[gumerman]

I just merged your code into my website but when the Cart displays it is in a small window with scroll bars. I assume it is something in the CSS but I can't figure it out. I have attached a screen print of what I have. Any help is appreciated. I would like the window to show like the sample you provided covering my web page. Thanks for a cool addition.

[Dr. Rolex]

I just merged your code into my website but when the Cart displays it is in a small window with scroll bars. I assume it is something in the CSS but I can't figure it out. I have attached a screen print of what I have. Any help is appreciated. I would like the window to show like the sample you provided covering my web page. Thanks for a cool addition.

 

Perhaps you solved this yourself by now, but anyway, try to set the CSS attribute z-index to 10000 on #ajax_cart_dialog. If that doesn't work, try to do the same on some other divs that is used by the mini cart. This should solve the problem with header showing above the cart.

 

Then change overflow: auto; to overflow: visible; on .ajax_cart and set a fixed with to the div or change this code in ajax_cart.php

$('.ajax_cart')
.css("width", width + 50);

 

Increase the + 50 until you have a correct width. Or comment/remove the code and add a fixed width to the CSS.

[Mene]

First of all, thank you for this great addon, I'm using it and it works like a charm! 

 

I would love to make the popup appear when a customer clicks on the "Add to cart" button in product_info.

 

Would you be so kind to help me? Is it possible?

 

Thank you,

Marco

[rabiraj]

Any way to make it run in phoenix version?