Conflict in Joomla + Virtuemart (add to cart in category)

Question

Here is website category - http://goo.gl/7lAlxl I've placed "default_addtocart.php" to /templates/ot_smarthouse/html/com_virtuemart/category/default_addtocart.php, and add buy button to category (add code to /templates/ot_smarthouse/html/com_virtuemart/category/default.php):

<?php
$this->product = $product;
echo $this->loadTemplate('addtocart');
?>

button now seen in category - http://prntscr.com/5xn8wn but when I click product doesn't add to cart, just redirect to cart (no product add) In my template ot_smarthouse I've found this script (/templates/ot_smarthouse/js/otscript.js):

/* OT Document JAVASCRIPT */
jQuery.noConflict();
jQuery(document).ready(function($) {

    $('a.ot_scrollable').bind('click', function(e) {
        e.preventDefault();
        $('html,body').animate({scrollTop: $(this.hash).offset().top});                                                         
    });

    $("#ot-body").append('<div id="ot-product-hover" class="product row-fluid" style="display: none; z-index:9999;"></div>');
    $(".product .spacer").mouseover(function() {
        $("#ot-product-hover").children().remove();
        $("#ot-product-hover").append($(this).parent().html());
        $("#ot-product-hover").css('width', parseInt($(this).width() + 42) + 'px');
        $("#ot-product-hover").css('top', parseInt($(this).offset().top - 5) + 'px');
        $("#ot-product-hover").css('left', parseInt($(this).offset().left - 5) + 'px');
        $("#ot-product-hover").css('display', 'block');
    });
    $("#ot-product-hover").mouseover(function() {
        $("#ot-product-hover").css('display', 'block');
    });
    $("#ot-product-hover, .product .spacer").mouseout(function() {
        $("#ot-product-hover").css('display', 'none');
    });
});

window.addEvent('domready', function () {
    $$('h3.mod-title').each(function (item) {
        var parts  = item.get('text').clean().split(' ');
        parts[0] = "<span class='first-word'>" + parts[0] + "</span>";

        item.set('html', parts.join(' '));
    });
});

When I'm disable it, everything works fine. But this script add hover enlarge when I hover on product, and I need this function.

How I can fix this problem?

Answer 1

Just add this line:

vmJsApi::jPrice();

to your

html/com_virtuemart/category/default.php

Answer 2

<script>
$.noConflict();
jQuery( document ).ready(function( $ ) {
// Code that uses jQuery's $ can follow here.
});
// Code that uses other library's $ can follow here.
</script>