I have done ajax add to cart product from product page, I am able to update the top cart contents successfully on Prototype ajax request success, but when I try to initialize the jquery progressbar(which is already included in top cart) from the success event of the prototype ajax request, then it doesn't work at all.

Progress bar works fine if I do a page reload (document ready).

Below is my code.

function updatetopcart() {
    var ajxformurl = $('ajaxTLUrl').getValue();
    new Ajax.Request(ajxformurl, {
    onSuccess: function(response) {
        var transport = response.responseText.evalJSON(true);
        var toplinkcontent = transport.content;
        $$('#minicart').invoke('replace', toplinkcontent);
        //Reset top cart hover flap
        //Reset free delivery progress bar
        return true;
    onException: function(request,e){
function resetFlaps() {
    $('minicart').observe('mouseover', function(e) {
        $('minicart-panel').setStyle({backgroundColor: '#FFFFFF'});
    $('minicart').observe('mouseout', function(e) {

    $('minicart_mobile').observe('mouseover', function(e) {
        $('minicart-panel_mobile').setStyle({backgroundColor: '#FFFFFF'});
    $('minicart_mobile').observe('mouseout', function(e) {
    return true;

function resetFDBar() {
    (function($) {
            max: Number(jQuery('#maxPriceVal').val()),
            value: Number(jQuery('#currPriceVal').val())
    return true;

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.