Help with matchHeight.js and multi-variant Dynamic update

[OliviaH]

Joomla 3.8.0
VirtueMart 3.0.12
PHP 5.6.30

I have used MatchHeight.js to make the containers in my product pages the same height, it works fine on page load and sometimes when the page is dynamically updated.
The problem I am having is that when a child product has a different sized image the matchheight seems to mess up. How the dynamic update and everything works isn't something I'm all that knowledgeable on.

Link to an example problem page: http://www.flooringsales.co.uk/clone/component/virtuemart/wood-flooring/parent-01-detail?Itemid=519

Currently I fire the code at the bottom of the productdetails deafult.php

Code Select Expand

$j = "jQuery(document).ready(function($) {
$('.p-col').matchHeight();
});";
vmJsApi::addJScript('matchHeightUpdate',$j);
echo vmJsApi::writeJS();

It seems to run the script on the dynamic update before adding the new image, so if the image is bigger than the other elements it overflows. (see attached image)

I think I am using a template overrides.
If you need anymore information please let me know.

[jenkinhill]

Yes you are using overrides and of course, matchheight is not part of VM, it is not necessary with VM default templates. See http://forum.virtuemart.net/index.php?topic=108212.0

Joomla 3.8.0
VirtueMart 3.0.12

You should use at least VM3.2.2 with Joomla 3.7+   - http://virtuemart.net/news/latest-news/480-security-release-of-joomla-3-7-be-prepared

[K&K media production]

you need something like a JS on change function to update your matchHeight items

[OliviaH]

Thank you K&K media production, I'll give that a go.

[lausianne]

Hi DanBH,

have you ever been able to figure it out?

Thanks!

[Studio 42]

jQuery(document).ready(function($) {
only run on document ready, so not on updating the view, because document is already ready