Spiral Scripts Support Forum :: Topic: Product Snapshot in a custom component (1/1)

Welcome, Guest

Page:
1

TOPIC: Product Snapshot in a custom component

Product Snapshot in a custom component 7 months 1 day ago #623

gibilogic
OFFLINE
Fresh Boarder
Posts: 3
Karma: 0

Hello,
I bought Product Snapshot PRO and I am trying to do an advanced use of it.

If I use it in an article, everything is fine.

If I manually use the ContentPrepare method on a text in a custom component, everything is fine APART from the fact that the quantity buttons (+ and -) don't work. I checked and double checked the JavaScript inclusion and so on, and I am not able to understand why. No JS errors are reported.

I changed to the default template to be sure it was not template related.

In case you need it:

1) A working sample of Product Snapshot in an article is here:

demo.cartucciaperfetta.it/nostra-azienda/contatti

2) To show the "error", you'll have to use the search module at the top left of the page ("Cerca qui le tue cartucce toner"):

Marca: Brother
Tipo: Inkjet
Modello: MFC-730

Again, everything works apart from the + and - buttons.

Thank you for any suggestion.

The administrator has disabled public write access.

Product Snapshot in a custom component 7 months 1 day ago #624

gibilogic OFFLINE Fresh Boarder Posts: 3 Karma: 0	I think I've found a possible reply to my own question. Plus and Minus click events are created at page loading by vmprices.js. Since I am creating new DOM elements afterwards, they cannot have these events attached. I have to re-apply the events somehow.
	The administrator has disabled public write access.

Product Snapshot in a custom component 7 months 1 day ago #625

boggler
NOW ONLINE
Moderator
Posts: 420
Thank you received: 46
Karma: 9

Ok, I have managed to see the problem.

This is not exactly a javascript 'error', but it is a scripting problem. The thing is that the search results are loaded by AJAX, they are not part of the original page load. When the page load first happens, Virtuemart has various scripts that it executes in order to make the buttons work, basically just adding event listeners so that the cart buttons respond to clicks.

The ones that run the cart buttons seem to be in the file: http://demo.cartucciaperfetta.it/components/com_virtuemart/assets//js/vmprices.js

What you need to do to make this work is to run a script when the AJAX loading has completed to re-initialise the buttons, with a quick inspection it looks like the following:

Virtuemart.product($("form.product"));

			$("form.js-recalculate").each(function(){
				if ($(this).find(".product-fields").length) {
					var id= $(this).find('input[name="virtuemart_product_id[]"]').val();
					Virtuemart.setproducttype($(this),id);

				}
			});

It may take some trial and error to make this work but it should be possible I think.

The administrator has disabled public write access.

The following user(s) said Thank You: gibilogic

Product Snapshot in a custom component 7 months 1 day ago #626

boggler NOW ONLINE Moderator Posts: 420 Thank you received: 46 Karma: 9	Your reply came at the same time I was writing mine - yes I think you are right, I think it should be the code that I mentioned that should solve this.
	The administrator has disabled public write access.

Product Snapshot in a custom component 7 months 21 hours ago #627

gibilogic OFFLINE Fresh Boarder Posts: 3 Karma: 0	The code Virtuemart.product(jQuery("form.product")); Seems to do the trick. I had to use the "jQuery" form because my component uses MooTools. Still some testing to do, but it seems to work! Thank you.
	The administrator has disabled public write access.