Post by annettek » Fri Apr 10, 2020 6:36 pm

hi,

I am trying to add a second add to cart button at the bottom page opencart 3.x.

js:

Code: Select all

<script type="text/javascript"><!--
$('#button-cart1').on('click', function() {
	
	$.ajax({
		url: 'index.php?route=extension/soconfig/cart/add',
		type: 'post',
		data: $('#product input[type=\'text\'], #product input[type=\'hidden\'], #product input[type=\'radio\']:checked, #product input[type=\'checkbox\']:checked, #product select, #product textarea'),
		dataType: 'json',
		beforeSend: function() {
			$('#button-cart1').button('loading');
		},
		complete: function() {
			$('#button-cart1').button('reset');
		},
		success: function(json) {
			$('.alert').remove();
			$('.text-danger').remove();
			$('.form-group').removeClass('has-error');
			if (json['error']) {
				if (json['error']['option']) {
					for (i in json['error']['option']) {
						var element = $('#input-option' + i.replace('_', '-'));
						
						if (element.parent().hasClass('input-group')) {
							element.parent().after('<div class="text-danger">' + json['error']['option'][i] + '</div>');
						} else {
							element.after('<div class="text-danger">' + json['error']['option'][i] + '</div>');
						}
					}
				}
				
				if (json['error']['recurring']) {
					$('select[name=\'recurring_id\']').after('<div class="text-danger">' + json['error']['recurring'] + '</div>');
				}
				
				// Highlight any found errors
				$('.text-danger').parent().addClass('has-error');
			}
			
			if (json['success']) {
				$('.text-danger').remove();
				$('#wrapper').before('<div class="alert alert-success"><i class="fa fa-check-circle"></i> ' + json['success'] + ' <button type="button" class="fa fa-close close" data-dismiss="alert"></button></div>');
				$('#cart  .total-shopping-cart ').html(json['total'] );
				$('#cart > ul').load('index.php?route=common/cart/info ul li');
				
				timer = setTimeout(function () {
					$('.alert').addClass('fadeOut');
				}, 4000);
				$('.so-groups-sticky .popup-mycart .popup-content').load('index.php?route=extension/module/so_tools/info .popup-content .cart-header');
			}
			
		
		},
        error: function(xhr, ajaxOptions, thrownError) {
            alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
        }
	});
});

//--></script> 
I've changed the div id to the new one to match the button.

Code: Select all

<input type="button" value="{{ button_cart }}" data-loading-text="{{ text_loading }}" id="button-cart1" class="btn btn-mega btn-lg">
but it's not working any help would be greatly appreciated.

I want to use in a div that appears at the bottom of the page when you scroll past the add to cart button on the page so there is always one in view for the customer.

thanks in advance

Newbie

Posts

Joined
Fri Apr 10, 2020 6:30 pm

Post by cyclops12 » Fri Apr 10, 2020 7:52 pm

Would you not be better making the add to cart button sticky so when you scroll down the page it stays in view?

Expert Member

Posts

Joined
Sun Sep 27, 2015 1:10 am

Post by annettek » Fri Apr 10, 2020 8:03 pm

when you scroll down the page past the add to cart button, a fixed div appears at the bottom with product image, price etc and add to cart button I have seen this on many sites and have the code for it good. Just need to sort out the second add to cart button. when I was using of 2.x this method worked fine.

Newbie

Posts

Joined
Fri Apr 10, 2020 6:30 pm

Post by letxobnav » Fri Apr 10, 2020 9:10 pm

button is showing?

Crystal Light Centrum Taiwan
Extensions: MailQueue | SUKHR | VBoces

“Data security is paramount at [...], and we are committed to protecting the privacy of anyone who is associated with our [...]. We’ve made a lot of improvements and will continue to make them.”
When you know your life savings are gone.


User avatar
Expert Member

Posts

Joined
Fri Aug 18, 2017 4:35 pm
Location - Taiwan

Post by straightlight » Fri Apr 10, 2020 9:49 pm

Please post your URL. You could also use the built-in example in the catalog/view/javascript/common.js and the catalog/view/theme/default/template/product/product.twig file with the cart.add function. By duplicating that function and rename the queries with URL inside Ajax, you could then re-integrate the Ajax response content you'd like to show on the front-end.

The most generated errors being found on Opencart forum originates from contributed programming. The increased post counters are caused by redundancies of the same solutions that were already provided prior.


Regards,
Straightlight
Programmer / Opencart Tester


Legendary Member

Posts

Joined
Mon Nov 14, 2011 11:38 pm
Location - Canada, ON

Post by annettek » Sat Apr 11, 2020 6:38 am

straightlight wrote:
Fri Apr 10, 2020 9:49 pm
Please post your URL. You could also use the built-in example in the catalog/view/javascript/common.js and the catalog/view/theme/default/template/product/product.twig file with the cart.add function. By duplicating that function and rename the queries with URL inside Ajax, you could then re-integrate the Ajax response content you'd like to show on the front-end.
This is page URL: https://bit.ly/2ViB9dw

Scroll down past the add to cart and div will appear at the bottom.

Newbie

Posts

Joined
Fri Apr 10, 2020 6:30 pm

Post by letxobnav » Sat Apr 11, 2020 12:00 pm

then use the right id, not a copy
<input type="button" value="Add to Cart" data-loading-text="Loading ..." id="button-cart" class="btn btn-mega btn-lg">

Crystal Light Centrum Taiwan
Extensions: MailQueue | SUKHR | VBoces

“Data security is paramount at [...], and we are committed to protecting the privacy of anyone who is associated with our [...]. We’ve made a lot of improvements and will continue to make them.”
When you know your life savings are gone.


User avatar
Expert Member

Posts

Joined
Fri Aug 18, 2017 4:35 pm
Location - Taiwan

Post by straightlight » Sat Apr 11, 2020 8:48 pm

Code: Select all

<button type="button" id="button-second-cart" data-loading-text="{{ text_loading }}" class="btn btn-mega btn-lg">{{ button_cart }}</button>

The most generated errors being found on Opencart forum originates from contributed programming. The increased post counters are caused by redundancies of the same solutions that were already provided prior.


Regards,
Straightlight
Programmer / Opencart Tester


Legendary Member

Posts

Joined
Mon Nov 14, 2011 11:38 pm
Location - Canada, ON

Post by annettek » Sun Apr 12, 2020 9:55 am

still no luck.

think something else may be wrong with the product page.

when editing it in FTP then refresh cache the page does not update.
the only way I can update it to go into theme editor edit the page there then save it.

I make a change I FTP then refresh modification cache the changes don't show up.

there is all the code in theme editor but if I go in to edit the file manually I don't see some parts of it don't know why.

even weirder if I rename the product.tig file and refresh cache it still loads fine.

When I try to turn on or off the theme or SASS cage I get internal server error

Newbie

Posts

Joined
Fri Apr 10, 2020 6:30 pm

Post by annettek » Tue Apr 14, 2020 8:37 pm

I finally solved my issues.

The product page not updating was because I used the internal theme editor in the admin. I had to remove the history from that for the pages I edited and then cleared the modification cache and theme cache and sass cache, as I believe if you use that editor it keeps a copy of the page in the database and only loads that page not sure if that s true. That fixed that issue.

The extra product add to cart button that was solved by using the below code. I guess the reason it didn't work as I could not edit the product page in FTP and keep changes as I used the theme editor before I tried to add the button.

Code: Select all

<div  title="Add To Cart" class="cart"><input type="button" value="Add to Cart" data-loading-text="Loading ..." id="button-cart" class="btn btn-mega btn-lg  bottom-cart"></div>
Thanks to all who helped me out.

Newbie

Posts

Joined
Fri Apr 10, 2020 6:30 pm
Who is online

Users browsing this forum: No registered users and 24 guests