jQuery/Ajax Shopping Cart

[steffanih]

Uh...actually, now instead of updating it shows the total price, but thanks for trying to help. Much appreciated.

[steffanih]

Uh...actually, now instead of updating it shows the total price, but thanks for trying to help. Much appreciated.

Alight, I removed this line from my shopping_cart.php

<?php echo tep_draw_form('cart_quantity', tep_href_link(FILENAME_SHOPPING_CART, 'action=update_product')); ?>

It's updating quantities just peachy now. But my remove isn't functioning now. I will go back through this forum and see if I can find the answer.

Edited June 3, 2011 by steffanih

[Simpel]

Hi,

 

there is a way to put this on the product list too?

 

Somebody got this working? I only get it work with the first product in the list. Not with all items of the list.

[Simpel]

Changing the PRODUCT_LIST_IMAGE and PRODUCT_LIST_BUY_NOW something like this in de product_listing file

 

        case 'PRODUCT_LIST_IMAGE':
           $lc_align = 'center';
           if (isset($HTTP_GET_VARS['manufacturers_id'])) {
             $lc_text = '<a href="' . tep_href_link(FILENAME_PRODUCT_LISTING, 'manufacturers_id=' . $HTTP_GET_VARS['manufacturers_id'] . '&products_id=' . $listing['products_id']) . '">' . tep_image(DIR_EXT_HTTP . $listing['products_image'], $listing['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT) . '</a>';
           } else {
             $lc_text = '
		<script language="javascript"><!--
		document.write(\'<a href="javascript:popupWindow(\\\'' . tep_href_link(FILENAME_POPUP_IMAGE, 'pID=' . $listing['products_id']) . '\\\')">' . tep_image(DIR_EXT_HTTP . $listing['products_image'], addslashes($listing['products_name']), SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5" id="cart-image-1"') . '<br>Click to enlarge</a>\');
		//--></script>
		<noscript>
		<a href="' . tep_href_link(DIR_EXT_HTTP . $listing['products_image']) . '" target="_blank">' . tep_image(DIR_EXT_HTTP . $listing['products_image'], $listing['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') . '<br>' . TEXT_CLICK_TO_ENLARGE . '</a>
		</noscript>
		<div id="wrapper" style="float:right;"></div>
		<span id="pi-product-listing" style="display:none"><a href="' . tep_href_link(FILENAME_PRODUCT_LISTING, 'products_id=' . (int)$listing['products_id']) . '" title="' . $listing['products_name'] . '">' . $listing['products_name'] . '</a></span>';
           }
           break;

       case 'PRODUCT_LIST_BUY_NOW':
                       $lc_align = 'center';
                       if ( tep_has_product_attributes($listing['products_id']) ) {
                         $lc_text = '<a href="';
                         if (isset($HTTP_GET_VARS['manufacturers_id'])) {
                               $lc_text = tep_href_link(FILENAME_PRODUCT_LISTING, 'manufacturers_id=' . $HTTP_GET_VARS['manufacturers_id'] . '&products_id=' . $listing['products_id']);
                         } else {
                               $lc_text = tep_href_link(FILENAME_PRODUCT_LISTING, ($cPath ? 'cPath=' . $cPath . '&' : '') . 'products_id=' . $listing['products_id']);
                         }
                         $lc_text = '">more info...</a> ';
                       } else {
                         $lc_text = tep_draw_form( 'cart_quantity_' . $listing['products_id'], tep_href_link(FILENAME_PRODUCT_LISTING, tep_get_all_get_params('') . 'action=add_product&products_id=' . $listing['products_id']) ) . '<input type="hidden" name="products_id" value="' . $listing['products_id'] . '"><input type="text" name="quantity" value="1" maxlength="4" size="3">    '. tep_image_submit('button_in_cart.gif', IMAGE_BUTTON_IN_CART,'id="pi-add-to-cart"'). '</form>';

					}
                       break;

               }

 

 

But only the first item will be pick by this contribution and fly.

of course you have to put the 2 .js files in de product_listing file or in the header_php file.

 

Hope somebody get help to finish this case.

[Simpel]

Firebug says

 

/button_in_cart.gif">events=Object { click=[1]}handle=function() for the first product in the product list.

 

The second and futher gives only /button_in_cart.gif">

 

what could that be? it should be repeat?

 

another fix to show the model in the shoppingbox

 

  <span id="pi-product-listing" style="display:none">

 

to

 

  <span id="pi-product-info" style="display:none">

[Simpel]

Edit includes/functions/html_output.php

 

 

Next find this code:

 

 $form .= '>';
   return $form;

 

Directly BEFORE add this:

 

 // AJAX Addto shopping_cart - Begin
   if( preg_match("/add_product/i", $action) ){
     $form .= 'id="pi-add-to-cart"';
   }
 // AJAX Addto shopping_cart - End

 

Now all buy now buttons in de product listing put the first product in the shoppingcart

 

nobody want this in the product-listing? its a little bit quiet over here..

 

I think we had to change the something in the jquery-oscart.js to connect 'id="pi-add-to-cart" for each product_id

Edited June 6, 2011 by Simpel

[Simpel]

Hi there

 

after update the contribution to the latest version of jquery 1.6.4 jquery.min.js

I got the following error:

 

uncaught exception: Syntax error, unrecognized expression: [name=cart_delete[]]

 

This is the $('input[name=cart_delete[]]').css('display', 'none'); rule in jquery-oscart.js

 

How to solve this problem? where is the syntax error?

[exen]

Hi eveyone,

 

I tried to install it and I've different problem

1- already report, but i didn find the solution, is th problem of the total price being updated in the shopping-cart-box, a whole new oscommerce window opens INSIDE the shopping cart box. Does anyone have a solution? exept remove ('<span id=boxcart-total>' . $currencies->format($cart->show_total()) . '</span>' )

 

 

I also struggled with this problem ... When you add a product to the cart opened up a whole page catalog in a place where it should be subtotal for shopping-cart-box.

The solution is to change the store admin panel options

"Show cart after adding the product" to TRUE.

 

Regards,

[PiLLaO]

Hi!,

 

Last versión doesn't work in localhost :(

[Dr. Rolex]

Hi!,

 

Last versión doesn't work in localhost :(

 

How do you mean localhost? Did you copy the files from catalog/ or did you modifiy the ones you already have?

 

Also, the jquery-oscart.js was in the wrong directory. Make sure that it's located under ./ext/modules/shopping_cart/jquery-oscart.js

[Dr. Rolex]

Another minor update to make the cloned product picture slideup after the animation completes:

(Without this the cloned image will still be clickable to the right of the shopping cart even if it's hidden)

 

In ./ext/modules/shopping_cart/jquery-oscart.js

 

On line 115

 

Find:

   });

return(false) ;

});

 

Replace with:

 })
.slideUp();

return(false) ;

 

Also, if you have a modified product listing (e.g. "CSS product lists"), you can post your code here and I'll try to help you modify it.

Edited June 1, 2013 by Dr. Rolex

[Dr. Rolex]

Another minor update to make the cloned product picture slideup after the animation completes:

(Without this the cloned image will still be clickable to the right of the shopping cart even if it's hidden)

 

In ./ext/modules/shopping_cart/jquery-oscart.js

 

On line 115

 

Find:

});

return(false) ;

});

 

Replace with:

 })
.slideUp();

return(false) ;

 

Also, if you have a modified product listing (e.g. "CSS product lists"), you can post your code here and I'll try to help you modify it.

 

Couldn't edit my post...

 

Correct code is:

 

Replace with:

})
.slideUp();
return(false) ;
});

[Nico01]

Dr. Rolex,

 

I had the same problem as PiLLaO, it doesn't work on my testarea / localhost.

The last to posts fixed this problem. It works also in product listing.

Thanks for your time and sharing.

 

One question:

It works in product info only with the first image, if somebody has more to show.

Is this correct or a bug ?

 

Regards

Nico

[Dr. Rolex]

Dr. Rolex,

 

I had the same problem as PiLLaO, it doesn't work on my testarea / localhost.

The last to posts fixed this problem. It works also in product listing.

Thanks for your time and sharing.

 

One question:

It works in product info only with the first image, if somebody has more to show.

Is this correct or a bug ?

 

Regards

Nico

 

Hello Nico!

 

I'm glad you appreciate the work. I have easily used up more than 100 hours in total to "perfect" this contribution. But it has been a great project to learn more php and javascript.

 

All credit goes to the original contributor delete13 of course.

 

I hadn't notice the problem with multiple images, but I'm working on a solution. I just need to recode the animation javascript.

The problem is that all the images gets the same id tags. I'll post the solution as soon as I have it.

 

Best regards,

Dr. Rolex

[PiLLaO]

Thank you for the fix :)

 

And Many Thanks for your work!!! :)

[Dr. Rolex]

OK people! I've solved the multiple pictures problem and also managed to improve the animation itself.

 

I'll upload the new version as soon I'm done with the damn instructions for it. :thumbsup:

Also, I'll add some info in the jquery-oscart.js file for easy understanding if you want to modify some part of the animation.

 

Best regards,

Dr. Rolex

[Dr. Rolex]

New version uploaded:

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

 

Added Features on Rev 1.1:

• Supports multiple product images on the "product_info" page
  
• Improved jQuery animation
  
• Added some comments on how to customize the animation
  

[baumfist]

Very good work! I've searched for a long time after that.

However I still have some little problems. It would be great if someone could help me.

 

For products without attributes if everything works fine.

 

 

But when I put on the product_info products with attributes in the cart, then the amount of added products in shopping_cart_infobox doesn't update.

 

If I do the same in the product_listing, then the amount of added products in shopping_cart_infobox updates . The amount of added products in the shopping cart in the header and the total in the shopping_cart_infobox doesn't update..

 

 

And another problem:

If products with attributes are in the shoping_cart , and you take the plus or minus button to change the amount of added products, then you will be linked to http://localhost/example/ #. and the amount of the product remains unchanged.

 

Please Help

[Dr. Rolex]

Very good work! I've searched for a long time after that.

However I still have some little problems. It would be great if someone could help me.

 

For products without attributes if everything works fine.

 

 

But when I put on the product_info products with attributes in the cart, then the amount of added products in shopping_cart_infobox doesn't update.

 

If I do the same in the product_listing, then the amount of added products in shopping_cart_infobox updates . The amount of added products in the shopping cart in the header and the total in the shopping_cart_infobox doesn't update..

 

 

And another problem:

If products with attributes are in the shoping_cart , and you take the plus or minus button to change the amount of added products, then you will be linked to http://localhost/example/ #. and the amount of the product remains unchanged.

 

Please Help

 

Hello Mr. Baumfist,

 

I think I have solved your problems. I don't use attributes myself so that's why I never cared to see if they worked.

 

Could you please make the following modifications to jquery-oscart.js and report back if it worked for you:

 

Find:

$('form[name=cart_quantity-' + productId + ']').find('select option:selected').each(function() {

 

Replace with:

$('form[name=cart_quantity]').find('select option:selected').each(function() {

 

Find & Replace ALL occurrences of (I think there is 4 in total):

$('tr[id=pc-' + products_id + ']').remove() ;

 

With:

$(document.getElementById('pc-' + products_id)).remove() ;

[baumfist]

Hello Dr. Rolex,

many thanks for the quick help!!! You're the best. I've tried your suggestions.

 

Part of the problem is resolved, but I still have the problem with the plus and minus buttons for products with attributes in shopping_cart.

When I press one of these buttons, then I am connected to the index page. The <a href = "#" .. on the shopping_cart will probably misinterpreted.

 

I use a freshly installed oscommerce shop 2:33 to avoid other sources of mistakes. Unfortunately I know too little about javascript to solve it myself. Would be really cool if you could help me.

[Dr. Rolex]

Hello Dr. Rolex,

many thanks for the quick help!!! You're the best. I've tried your suggestions.

 

Part of the problem is resolved, but I still have the problem with the plus and minus buttons for products with attributes in shopping_cart.

When I press one of these buttons, then I am connected to the index page. The <a href = "#" .. on the shopping_cart will probably misinterpreted.

 

I use a freshly installed oscommerce shop 2:33 to avoid other sources of mistakes. Unfortunately I know too little about javascript to solve it myself. Would be really cool if you could help me.

 

No problem at all, after years of leeching from other contributors I want to give something back to the oscommerce community now when I can. :)

 

It seems to be working for me and I'm also testing on a fresh 233 install, here is my jquery-oscart.js code, try to replace your entire code with mine:

 

/* jQuery Shopping Cart
*
* Published under GNU License
*
* 2010/07/01 - by delete ( olivier@smartmarseille.com )
* 2010/07/14 - by delete ( olivier@smartmarseille.com ) - Added Attributes support
* 2013/05/31 - by Dr. Rolex - Added support for product listing and osCommerce 2.3.3
* 2013/06/03 - by Dr. Rolex - Supports multiple product images, Improved animation
*/
$(document).ready(function() {
// Add to cart for product_info page
//
$('.buttonAction_oscart').click(function()
{
// Partial Source code from : http://webresourcesdepot.com/wp-content/uploads/file/jbasket/fly-to-basket/
var productId = $(this).attr('id');
var $oldprod = $('#cart-image-' + productId );
//First we clone the image to the shopping cart and get the offset
var $newprod = $oldprod.clone().appendTo('#boxcart-content');
var newOffset = $('#boxcart-content').offset();

//Get the old position
var oldOffset = $oldprod.offset();
//Clone the old image for use in animation
var $tempprod = $oldprod.clone().appendTo('body');
//Hide new image and set css attributes
//Use big z-index, make sure to edit this to something that works with the page
$tempprod
.css('position', 'absolute')
.css('left', oldOffset.left)
.css('top', oldOffset.top)
// .css('border', '1px dashed black'); //Optional dashed square around image
.css('zIndex', 1000);
$newprod.hide();
// $oldprod.hide(); //Optional hide image on start of animation (Uncomment $oldprod.show(); below together with this)
//Animate the $tempprod to the position of $newprod
$tempprod
.animate({opacity: 0.4}, 40) //First value is how transparent image is at start of animation; Last value is millisec until animation starts
.animate( {
opacity: 0.0, // Transparency of image at end of animation
'top': newOffset.top, // How high we will fly
'left':newOffset.left, // How far we will fly
width: $oldprod.width() / 3, // Resize image width on animation
height: $oldprod.height() / 3 // Resize image height on animation
}, 1000, function(){ // Value is total time for animation to finish

 //Callback function, we remove $newprod and $tempprod
 $newprod.remove();
 $tempprod.remove();
//	 $oldprod.show(); //Optional show image on end of animation (Uncomment $oldprod.hide(); above together with this)

	 products_id = productId ;
	 qty = parseInt($('#pq-' + productId).html());

	 if ( qty ) qty = qty + 1 ;
	 else qty = 1 ;

	 // Look for attributes
	 //
	 products_attributes = '' ;
	 $('form[name=cart_quantity]').find('select option:selected').each(function() {
		 products_attributes += '{' + $(this).parent().attr('name').replace(/[^0-9]/g, '') + '}' + $(this).val() ;
	 });
	 if ( products_attributes != '' ) products_id = products_id + products_attributes;

	 // Delete button in shopping cart infoboxe
	 //
	 new_button = $('#boxcart-button-remove').clone() ;
	 new_button.find('a').attr('id', 'bcr' + $('input[name="products_id"]').val()) ;
	 new_button.find('a').attr('rel', products_id) ;
	 // Products details in shopping cart infoboxe
	 //
	 product_name = '<tr id="pc-' + products_id + '"><td align="right" valign="top"><span class="newItemInCart">';
	 product_name += '<span id="pq-' + products_id + '">' + qty +'</span> x </span></td><td valign="top"><span class="newItemInCart">' ;
	 product_name += $('#pi-product-info-' + productId).html() ;
	 product_name += '</span>' ;
	 product_name += new_button.html() ;
	 product_name += '<input type="hidden" name="products_id[]" value="' + products_id + '" />' ;
	 product_name += '<input type="checkbox" name="cart_delete[]" value="' + products_id + '" style="display:none;" />' ;
	 product_name += '</td></tr>' ;
	 // Updating infobox content Ta bort Dubblering
	 $("#boxcart-total-area").show();
	 $.ajax({
		 type: 'POST',
		 url: encodeURI($('form[name=cart_quantity-' + productId + ']').attr('action')) + '&show_total=1&ajax=1',
		 data: $('form[name=cart_quantity-' + productId + ']').serialize(),
		 success: function(data) {
			 $('#boxcart-total').html(data);
 update_cart();
		 }
	 });

	 // Remove product from infobox list
	 //
	 $(document.getElementById('pc-' + products_id)).remove() ;

	 // Product count
	 //
	 count = $('tr[id^="pc-"]').size() ;
	 if ( count == 0 ) $('#boxcart-content').html('') ;
//update_cart();

	 // Append product to the list
	 $('#boxcart-content').append( product_name ) ;

	 $('#' + new_button.find('a').attr('id') ).click(function()
	 {
	 return($(this).boxcart_remove());
	 });


 });
return(false) ;
});
// Update cart infobox
//
function update_cart()
{
$.ajax({
 type: 'POST',
url: encodeURI($('form[name=boxcart_quantity]').attr('action')) + '&count_contents=1&ajax=1',
 data: $('form').serialize(),
 success: function(data) {
	 $('#headercart').html(data);
	 }
 });
return(false);
}
// Remove from cart infobox
//
$.fn.boxcart_remove = function() {
products_id = $(this).attr('rel') ;
if ( ! confirm( $('#boxcart-text-remove').html() + ' ?' ) ) return false ;

$('input[value="' + products_id + '"][name=\"cart_delete[]\"]').attr('checked', true) ;
// Refresh entire page if current page is shopping_cart.php !
//
url = $(location).attr('href').split("/");
filename = url[url.length - 1];
filename = filename.split('\?')[0] ;		

if ( filename == 'shopping_cart.php' )
{
$('form[name=boxcart_quantity]').submit();
}
// Updating cart total
//
$.ajax({
 type: 'POST',
 url: encodeURI($('form[name=boxcart_quantity]').attr('action')) + '&show_total=1&ajax=1',
 data: $('form[name=boxcart_quantity]').serialize(),
 success: function(data) {
	 $('#boxcart-total').html(data);
	 update_cart();
	 }
 });

$(document.getElementById('pc-' + products_id)).remove() ;
// Product count
//
count = $('tr[id^="pc-"]').size() ;
if ( count == 0 ) {
$("#boxcart-total-area").hide();
$('#boxcart-content').html('<tr><td align="right" valign="top">' + $('#boxcart-text-empty').html() + '</td></tr>') ;
}
return(false);	
}
$('.boxcart-remove').click(function()
{
return($(this).boxcart_remove());
});
// Remove from cart
//
$.fn.cart_remove = function()
{
products_id = $(this).attr('rel') ;
$(document.getElementById('pc-' + products_id)).remove() ; ;

$('input[value="' + products_id + '"][name=\"cart_delete[]\"]').attr('checked', true) ;
$.ajax({
 type: 'POST',
 url: encodeURI($('form[name=cart_quantity]').attr('action')) + '&show_total=1&ajax=1',
 data: $('form').serialize(),
 success: function(data) {
	 $('#boxcart-total').html(data);
	 }
 });

$.ajax({
 type: 'POST',
 url: encodeURI($('form[name=cart_quantity]').attr('action')) + '&ajax=1',
 data: $('form[name=cart_quantity]').serialize(),
 success: function(data) {
	 $("#content-body").html(data);
	 update_cart();
 },
 dataType: 'html'
 });
return(false);
}
$('.cart-remove').click(function()
{
return($(this).cart_remove());
});

// Plus or Minus function
//
$('.update-qty').click(function()
{
products_id = $(this).attr('rel') ;
val = parseInt( $('input[id="pl' + products_id + '"][name=\"cart_quantity[]\"]').val() ) ;
action = $(this).attr('class').split(' ').slice(-1) ;

if ( action == 'plus' )
{
val = val + 1 ;
}
else if ( action == 'moins' )
{
if ( val <= 0 ) return(false) ;
val = val - 1 ;
}
else
{
return(false) ;
}

$('input[id="pl' + products_id + '"][name=\"cart_quantity[]\"]').val(val) ;

// osCommerce default shopping cart infoboxe product line :
//
product_name = '<tr id="pc-' + products_id + '"><td align="right" valign="top"><span class="newItemInCart">';
product_name += '<span id="pq-' + products_id + '">' + val + '</span> x </span></td><td valign="top"><span class="newItemInCart">';
product_name += $(document.getElementById('pn-' + products_id)).html() ;
product_name += '</span>';
product_name += $('#boxcart-button-remove').html() ;
product_name += '<input type="hidden" name="products_id[]" value="' + products_id + '" />' ;	
product_name += '<input type="checkbox" name="cart_delete[]" value="' + products_id + '" style="display:none;" />' ;

// Look for attributes
//
products_attributes = '' ;
$('form[name=cart_quantity]').find('select option:selected').each(function() {
 products_attributes += '{' + $(this).parent().attr('name').replace(/[^0-9]/g, '') + '}' + $(this).val() ;
});
if ( products_attributes != '' ) products_id = products_id + products_attributes;
product_name += '</td></tr>' ;

// Updating infobox content
//


// Remove product from infobox list
//
$(document.getElementById('pc-' + products_id)).remove() ;

// Append product to the list
//
$('#boxcart-content').append( product_name ) ;
$.ajax({
 type: 'POST',
 url: encodeURI($('form[name=cart_quantity]').attr('action')) + '&ajax=1',
 data: $('form[name=cart_quantity]').serialize(),
 async:false,
 success: function(data) {
 $("#content-body").html(data);
 update_cart();
 },
 dataType: 'html'
});
// Updating cart total
//
$.ajax({
 type: 'POST',
 url: encodeURI($('form[name=cart_quantity]').attr('action')) + '&show_total=1&ajax=1',
 data: $('form').serialize(),
 success: function(data) {
	 $('#boxcart-total').html(data);
	 }
 });
return(false);
});
$('.update-qty').css('visibility', 'visible');
$('.cart-remove').css('visibility', 'visible');
$('.boxcart-remove').css('visibility', 'visible');
$('input[name=\"cart_delete[]\"]').css('display', 'none');
});

[baumfist]

Great! Great! It's working!

Thank you! Excuse me for my finickiness, but I noticed one small thing.

 

If I have a product with attributes on the product_listing and I click on "buy now", then the corresponding thumbnail flies completely correct the infobox shopping cart and it is there to see. But it only seems to be in the basket. If I then go to the shoping cart, this product with attributes, that was just pure flying, no longer there.

 

Perhaps you've also got an idea?

Is there a possibility to solve it like that: When you're on the product_listing, and you add products without attributes, everything works as currently.

But if you add products with attributes, you will be connected only to the pruduct_info (without flying thumbs).Then the customer would be forced to think about possible attributes. I think that would be a meaningful solution.

When the customer in the pruduct_info then press "Buy now" same product , then the thumbnail could fly in the infobox shopping cart, as it is currently.

[Dr. Rolex]

Great! Great! It's working!

Thank you! Excuse me for my finickiness, but I noticed one small thing.

 

If I have a product with attributes on the product_listing and I click on "buy now", then the corresponding thumbnail flies completely correct the infobox shopping cart and it is there to see. But it only seems to be in the basket. If I then go to the shoping cart, this product with attributes, that was just pure flying, no longer there.

 

Perhaps you've also got an idea?

Is there a possibility to solve it like that: When you're on the product_listing, and you add products without attributes, everything works as currently.

But if you add products with attributes, you will be connected only to the pruduct_info (without flying thumbs).Then the customer would be forced to think about possible attributes. I think that would be a meaningful solution.

When the customer in the pruduct_info then press "Buy now" same product , then the thumbnail could fly in the infobox shopping cart, as it is currently.

 

Try with replacing your ./includes/modules/product_listing.php with this (and reply if it worked):

 

<?php
/*
$Id$
osCommerce, Open Source E-Commerce Solutions
http://www.oscommerce.com
Copyright (c) 2010 osCommerce
Released under the GNU General Public License
*/
$listing_split = new splitPageResults($listing_sql, MAX_DISPLAY_SEARCH_RESULTS, 'p.products_id');
?>
<div class="contentText">
<?php
if ( ($listing_split->number_of_rows > 0) && ( (PREV_NEXT_BAR_LOCATION == '1') || (PREV_NEXT_BAR_LOCATION == '3') ) ) {
?>
<div>
 <span style="float: right;"><?php echo TEXT_RESULT_PAGE . ' ' . $listing_split->display_links(MAX_DISPLAY_PAGE_LINKS, tep_get_all_get_params(array('page', 'info', 'x', 'y'))); ?></span>
 <span><?php echo $listing_split->display_count(TEXT_DISPLAY_NUMBER_OF_PRODUCTS); ?></span>
</div>
<br />
<?php
}
$prod_list_contents = '<div class="ui-widget infoBoxContainer">' .
				 ' <div class="ui-widget-header ui-corner-top infoBoxHeading">' .
				 ' <table border="0" width="100%" cellspacing="0" cellpadding="2" class="productListingHeader">' .
				 '	 <tr>';
for ($col=0, $n=sizeof($column_list); $col<$n; $col++) {
$lc_align = '';
switch ($column_list[$col]) {
 case 'PRODUCT_LIST_MODEL':
 $lc_text = TABLE_HEADING_MODEL;
 $lc_align = '';
 break;
 case 'PRODUCT_LIST_NAME':
 $lc_text = TABLE_HEADING_PRODUCTS;
 $lc_align = '';
 break;
 case 'PRODUCT_LIST_MANUFACTURER':
 $lc_text = TABLE_HEADING_MANUFACTURER;
 $lc_align = '';
 break;
 case 'PRODUCT_LIST_PRICE':
 $lc_text = TABLE_HEADING_PRICE;
 $lc_align = 'right';
 break;
 case 'PRODUCT_LIST_QUANTITY':
 $lc_text = TABLE_HEADING_QUANTITY;
 $lc_align = 'right';
 break;
 case 'PRODUCT_LIST_WEIGHT':
 $lc_text = TABLE_HEADING_WEIGHT;
 $lc_align = 'right';
 break;
 case 'PRODUCT_LIST_IMAGE':
 $lc_text = TABLE_HEADING_IMAGE;
 $lc_align = 'center';
 break;
 case 'PRODUCT_LIST_BUY_NOW':
 $lc_text = TABLE_HEADING_BUY_NOW;
 $lc_align = 'center';
 break;
}
$columns = sizeof($column_list);
if ( ($column_list[$col] != 'PRODUCT_LIST_BUY_NOW') && ($column_list[$col] != 'PRODUCT_LIST_IMAGE') ) {
 $lc_text = tep_create_sort_heading($HTTP_GET_VARS['sort'], $col+1, $lc_text);
}
$prod_list_contents .= '	 <td' . (tep_not_null($lc_align) ? ' align="' . $lc_align . '"' : '') . '>' . $lc_text . '</td>';
}
$prod_list_contents .= '	 </tr>' .
					 ' </table>' .
					 ' </div>';
if ($listing_split->number_of_rows > 0) {
$rows = 0;
$listing_query = tep_db_query($listing_split->sql_query);
$prod_list_contents .= ' <div class="ui-widget-content ui-corner-bottom productListTable">' .
					 ' <table border="0" width="100%" cellspacing="0" cellpadding="2" class="productListingData">';
while ($listing = tep_db_fetch_array($listing_query)) {
 $rows++;
 $prod_list_contents .= '	 <tr>';
 for ($col=0, $n=sizeof($column_list); $col<$n; $col++) {
 switch ($column_list[$col]) {
	 case 'PRODUCT_LIST_MODEL':
	 $prod_list_contents .= '	 <td>' . $listing['products_model'] . '</td>';
	 break;
	 case 'PRODUCT_LIST_NAME':
	 if (isset($HTTP_GET_VARS['manufacturers_id']) && tep_not_null($HTTP_GET_VARS['manufacturers_id'])) {
		 $prod_list_contents .= '	 <td><a href="' . tep_href_link(FILENAME_PRODUCT_INFO, 'manufacturers_id=' . $HTTP_GET_VARS['manufacturers_id'] . '&products_id=' . $listing['products_id']) . '">' . $listing['products_name'] . '</a></td>';
	 } else {
		 $prod_list_contents .= '	 <td><a href="' . tep_href_link(FILENAME_PRODUCT_INFO, ($cPath ? 'cPath=' . $cPath . '&' : '') . 'products_id=' . $listing['products_id']) . '">' . $listing['products_name'] . '</a></td>';
	 }
	 break;
	 case 'PRODUCT_LIST_MANUFACTURER':
	 $prod_list_contents .= '	 <td><a href="' . tep_href_link(FILENAME_DEFAULT, 'manufacturers_id=' . $listing['manufacturers_id']) . '">' . $listing['manufacturers_name'] . '</a></td>';
	 break;
	 case 'PRODUCT_LIST_PRICE':
	 if (tep_not_null($listing['specials_new_products_price'])) {
		 $prod_list_contents .= '	 <td align="right"><del>' . $currencies->display_price($listing['products_price'], tep_get_tax_rate($listing['products_tax_class_id'])) . '</del>  <span class="productSpecialPrice">' . $currencies->display_price($listing['specials_new_products_price'], tep_get_tax_rate($listing['products_tax_class_id'])) . '</span></td>';
	 } else {
		 $prod_list_contents .= '	 <td align="right">' . $currencies->display_price($listing['products_price'], tep_get_tax_rate($listing['products_tax_class_id'])) . '</td>';
	 }
	 break;
	 case 'PRODUCT_LIST_QUANTITY':
	 $prod_list_contents .= '	 <td align="right">' . $listing['products_quantity'] . '</td>';
	 break;
	 case 'PRODUCT_LIST_WEIGHT':
	 $prod_list_contents .= '	 <td align="right">' . $listing['products_weight'] . '</td>';
	 break;
	 case 'PRODUCT_LIST_IMAGE':
	 if (isset($HTTP_GET_VARS['manufacturers_id']) && tep_not_null($HTTP_GET_VARS['manufacturers_id'])) {

// jQuery osCart START
		 $prod_list_contents .= '	 <td align="center"><div id="piGal_img-' . $listing['products_id'] . '"><a href="' . tep_href_link(FILENAME_PRODUCT_INFO, 'manufacturers_id=' . $HTTP_GET_VARS['manufacturers_id'] . '&products_id=' . $listing['products_id']) . '">' . tep_image(DIR_WS_IMAGES . $listing['products_image'], $listing['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'id="cart-image-' . (int)$listing['products_id'] . '"') . '</a></div></td>';
	 } else {
		 $prod_list_contents_attributes = '';
 $products_attributes_query = tep_db_query("select count(*) as total from " . TABLE_PRODUCTS_OPTIONS . " popt, " . TABLE_PRODUCTS_ATTRIBUTES . " patrib where patrib.products_id='" . (int)$listing['products_id'] . "' and patrib.options_id = popt.products_options_id and popt.language_id = '" . (int)$languages_id . "'");
 $products_attributes = tep_db_fetch_array($products_attributes_query);
 if ($products_attributes['total'] > 0) {
	 $products_options_name_query = tep_db_query("select distinct popt.products_options_id, popt.products_options_name from " . TABLE_PRODUCTS_OPTIONS . " popt, " . TABLE_PRODUCTS_ATTRIBUTES . " patrib where patrib.products_id='" . (int)$listing['products_id'] . "' and patrib.options_id = popt.products_options_id and popt.language_id = '" . (int)$languages_id . "' order by popt.products_options_name");
	 $cols = 0;
	 while ($products_options_name = tep_db_fetch_array($products_options_name_query)) {
		 $products_options_array = array();
		 $products_options_query = tep_db_query("select pov.products_options_values_id, pov.products_options_values_name, pa.options_values_price, pa.price_prefix from " . TABLE_PRODUCTS_ATTRIBUTES . " pa, " . TABLE_PRODUCTS_OPTIONS_VALUES . " pov where pa.products_id = '" . (int)$listing['products_id'] . "' and pa.options_id = '" . (int)$products_options_name['products_options_id'] . "' and pa.options_values_id = pov.products_options_values_id and pov.language_id = '" . (int)$languages_id . "'");
		 while ($products_options = tep_db_fetch_array($products_options_query)) {
		 $products_options_array[] = array('id' => $products_options['products_options_values_id'], 'text' => $products_options['products_options_values_name']);
		 if ($products_options['options_values_price'] != '0') {
			 $products_options_array[sizeof($products_options_array)-1]['text'] .= ' (' . $products_options['price_prefix'] . $currencies->display_price($products_options['options_values_price'], tep_get_tax_rate($listing['products_tax_class_id'])) .') ';
		 }
		 }
		 if (is_string($listing['products_id']) && isset($cart->contents[$listing['products_id']]['attributes'][$products_options_name['products_options_id']])) {
		 $selected_attribute = $cart->contents[$listing['products_id']]['attributes'][$products_options_name['products_options_id']];
		 } else {
		 $selected_attribute = false;
		 }


 if ($cols == 0)
 $prod_list_contents_attributes .= '<tr class="alt">';
 $cols++;
 $prod_list_contents_attributes .= '<td>' . $products_options_name['products_options_name'] . ':' . tep_draw_pull_down_menu('id[' . $products_options_name['products_options_id'] . ']', $products_options_array, $selected_attribute) . '</td>';
 if ($cols == 0) {
 $prod_list_contents_attributes .= '</tr>';
 }
 if ($cols == $columns)
 $cols = 0;
 }
 $prod_list_contents_attributes = '' . $prod_list_contents_attributes . '';
 for ($n=$cols; $n<$columns; $n++) {
 $prod_list_contents_attributes .= '<td class="tester"></td>';
 }
 $prod_list_contents_attributes .= '';


 }

		 $prod_list_contents .= '	 <td align="center"><div id="piGal_img-' . $listing['products_id'] . '"><a href="' . tep_href_link(FILENAME_PRODUCT_INFO, ($cPath ? 'cPath=' . $cPath . '&' : '') . 'products_id=' . $listing['products_id']) . '">' . tep_image(DIR_WS_IMAGES . $listing['products_image'], $listing['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'id="cart-image-' . (int)$listing['products_id'] . '"') . '</a></div></td>';
	 }
// jQuery osCart END
	 break;
	 case 'PRODUCT_LIST_BUY_NOW':
// jQuery osCart START
	 $prod_list_contents .= tep_draw_form('cart_quantity-' . $listing['products_id'] . '', tep_href_link(FILENAME_DEFAULT, 'products_id='.$listing['products_id'] . '&action=add_product')) . '	 <td align="center">' . '<span id="pi-product-info-'. (int)$listing['products_id'].'" style="display:none"><a href="' . tep_href_link(FILENAME_DEFAULT, tep_get_all_get_params(array('action')) . 'products_id=' . (int)$listing['products_id']) . '" title="' . $listing['products_name'] . '">' . $listing['products_name'] . '</a></span>' . '<span class="buttonAction_oscart2" style="float:none;" id="'.(int)$listing['products_id'].'">' . tep_draw_hidden_field('products_id', $listing['products_id']) . tep_draw_button(IMAGE_BUTTON_IN_CART, 'cart', null, 'primary') . '</span></td>' . $prod_list_contents_attributes . '</form>';
// jQuery osCart END
	 break;
 }
 }
 $prod_list_contents .= '	 </tr>';
}
$prod_list_contents .= ' </table>' .
					 ' </div>' .
					 '</div>';
echo $prod_list_contents;
} else {
?>
<p><?php echo TEXT_NO_PRODUCTS; ?></p>
<?php
}
if ( ($listing_split->number_of_rows > 0) && ((PREV_NEXT_BAR_LOCATION == '2') || (PREV_NEXT_BAR_LOCATION == '3')) ) {
?>
<br />
<div>
 <span style="float: right;"><?php echo TEXT_RESULT_PAGE . ' ' . $listing_split->display_links(MAX_DISPLAY_PAGE_LINKS, tep_get_all_get_params(array('page', 'info', 'x', 'y'))); ?></span>
 <span><?php echo $listing_split->display_count(TEXT_DISPLAY_NUMBER_OF_PRODUCTS); ?></span>
</div>
<?php
}
?>
</div>

[baumfist]

You're incredible!!!

Thank you. I will try it immediately.

[baumfist]

I've tried it. It's a great idea to map the attributes directly in the produckt_listing.

The buyer can immediately see where he can choose something or not. So far so good.

 

But unfortunately now the thumbs fly not more, when you press the "buy_now" button in the produkt_listing (whether for products with attributes or not).

Instead, you will be always connected to the shoping_cart after pressing it.

 

It would be really great if the thumbs in produkt_listing would now also fly to infobox_shopping_cart, regardless of whether the product has attributes or not.

Without always connecting to the shoping_cart. Because now the buyer has the overview already in the product_listing.

 

Thanks for your effort!