opencart - автоматическое обновление цены при изменении опции (jquery)

Мне нужно немного изменить систему магазина opencart, чтобы цена продукта обновлялась автоматически, поэтому я нашел скрипт, который я немного изменил, но прямо сейчас столкнулся с проблемой.

Первоначальная цена, полученная из div, обновляется значениями выбранного радио или опции выбора. Но когда у меня есть более одной опции в продукте (множественный выбор или радио), цена не обновляется соответствующим образом: всегда извлекается исходная цена (как из сценария), а при изменении другой опции она не обновляется с обновленной ценой до . Кроме того: когда вы выбираете одну опцию, затем другую и снова меняете первую опцию, это снова ничего не меняет.

Jquery-скрипт:

$(document).ready(function() {
   $('.option').change(function() {
   var OriginalPrice = $('#thisIsOriginal').text();
   OriginalPrice = OriginalPrice.replace( /,/,"." );

   var OriginalCurrency = OriginalPrice.substring(OriginalPrice.length - 1, OriginalPrice.length);
   OriginalPrice = OriginalPrice.substring(0,OriginalPrice.length - 1);

   if($('.option :checked').val()) {
    var newPriceValue = $('.option :checked').attr("id");
    newPriceValue = $("label[for='" + newPriceValue + "']").text();
   }
   if($('.option :selected').val()) {
    var newPriceValue = $('.option :selected').text();
   }

   newPriceValue = newPriceValue.replace( /,/,"." );

   var position1 = newPriceValue.indexOf("(");
   var position2 = newPriceValue.indexOf(")");
   position1 = position1+2;

   var finalPriceValue = newPriceValue.substring(position1, position2);
   if(newPriceValue.indexOf('.') == -1)
   {
    finalPriceValue = "0";
   }
   else
   {
    finalPriceValue = finalPriceValue.substring(0,finalPriceValue.length - 1);
   }
   console.log(finalPriceValue);

   finalPriceValue = parseFloat(finalPriceValue) + parseFloat(OriginalPrice);
   finalPriceValue = finalPriceValue.toFixed(2);
   finalPriceValue = finalPriceValue.replace( ".","," );

   $('#priceUpdate').text(finalPriceValue + OriginalCurrency);
   });
});

Цена указана в евро, поэтому он конвертирует ее в правильное десятичное значение и обратно.

Надеюсь, что это ясно, и кто-то может помочь!

Ваше здоровье!


jquery product option opencart
person Ben G    schedule 16.08.2012    source источник
comment
Судя по всему, этот код предназначен для простого изменения цены с одной на другую в зависимости от опции, а не промежуточной суммы всех опций и базовой цены.   -  person Jay Gilford    schedule 16.08.2012
comment
Это именно тот момент, когда у меня есть какая-то логическая проблема, чтобы разобраться в этом для себя :(   -  person Ben G    schedule 17.08.2012

Ответы (3)


arrow_upward
0
arrow_downward

Предположим, что другие части вашего кода работают по назначению (поскольку я не вижу пример вашего html). Также предполагается, что все ваши радиотеги и выбранные теги имеют class="option" добавленный к ним.

На данный момент вы проверяете, выбран или проверен каждый .option, но получаете только одно значение, когда может быть несколько значений.

function get_final_price_value(newPriceValue)
{
  newPriceValue = newPriceValue.replace( /,/,"." );

   var position1 = newPriceValue.indexOf("(");
   var position2 = newPriceValue.indexOf(")");
   position1 = position1+2;

   var finalPriceValue = newPriceValue.substring(position1, position2);
   if(newPriceValue.indexOf('.') == -1)
   {
    finalPriceValue = "0";
   }
   else
   {
    finalPriceValue = finalPriceValue.substring(0,finalPriceValue.length - 1);
   }

  return parseFloat(finalPriceValue)
}

var runningTotalUpdatedPrice = parseFloat(OriginalPrice);

$('.option :checked').each(function(index) {
    var newPriceValue = $(this).attr("id");
    newPriceValue = $("label[for='" + newPriceValue + "']").text();
    var finalPriceValue = get_final_price_value(newPriceValue);
    runningTotalUpdatedPrice = runningTotalUpdatedPrice + finalPriceValue;
});
$('.option :selected').each(function(index) {
    var newPriceValue = $(this).text();
    var finalPriceValue = get_final_price_value(newPriceValue);
    runningTotalUpdatedPrice = runningTotalUpdatedPrice + finalPriceValue;
});

runningTotalUpdatedPrice = runningTotalUpdatedPrice.toFixed(2);
runningTotalUpdatedPrice = runningTotalUpdatedPrice.replace( ".","," );

$('#priceUpdate').text(runningTotalUpdatedPrice + OriginalCurrency);
person Bhavik Maneck    schedule 29.08.2012
comment
Спасибо за это, я уже заработал, полностью переписав код, как в вашем примере, поэтому у нас была та же идея :) Я также добавил функцию смены изображения, чтобы изменить изображение продукта на любое изображение, установленное для выбранного вариант. Я думаю, что это очень полезно для OpenCart, поскольку существуют только коммерческие решения. - person Ben G; 13.09.2012
comment
Привет @BenG, не могли бы вы ответить на свой первоначальный вопрос своим исправлением, чтобы этот вопрос оказался полезным для других участников Stack Overflow, пожалуйста? Затем вы можете пометить свой ответ как правильный. Спасибо. - person zigojacko; 04.04.2013

arrow_upward
0
arrow_downward 

<script type="text/javascript">
function get_final_price_value(newPriceValue)
{

var position1 = newPriceValue.indexOf("(");
var position2 = newPriceValue.indexOf(")");

position1 = position1+2;

var finalPriceValue = newPriceValue.substring(position1, position2);

if(newPriceValue.indexOf('.') == -1)
{
 finalPriceValue = "0";

}
else
{
 finalPriceValue = finalPriceValue.substring(1,finalPriceValue.length - 1 );
}


 return finalPriceValue;
}

$(document).ready(function() {
$('.option').live('change',function() {
var OriginalPrice = $('#thisIsOriginal').text();
var OriginalCurrency = OriginalPrice.substring(0, 1);
OriginalPrice = OriginalPrice.substring(1);

var runningTotalUpdatedPrice = parseFloat(OriginalPrice);


$('.option :selected').each(function(index) {
    var newPriceValue = $(this).text();

    var finalPriceValue = get_final_price_value(newPriceValue);


    runningTotalUpdatedPrice = runningTotalUpdatedPrice +     parseFloat(finalPriceValue);
        });

 runningTotalUpdatedPrice = runningTotalUpdatedPrice.toFixed(2);

 $('#priceUpdate').text(OriginalCurrency + runningTotalUpdatedPrice  );

    }); 
 });
 </script>

только для Великобритании

person Naseem Sarwar    schedule 24.01.2013

arrow_upward
0
arrow_downward

Вот код, который я использовал, чтобы заставить работать изменение цены опциона. Кроме того, есть возможность изменить изображение продукта.

$(document).ready(function() {

//total value
var total = 0;

//get the original price and convert to decimal (Euro prices)
var OriginalPrice = $('#thisIsOriginal').text();
OriginalPrice = OriginalPrice.replace( /,/,"." );

//get the currency (in Euro placed at the end of the string)
var OriginalCurrency = OriginalPrice.substring(OriginalPrice.length - 1, OriginalPrice.length);
OriginalPrice = OriginalPrice.substring(0,OriginalPrice.length - 1);

function calcTotal() {
    $("input:checked").each(function() {
        var value1 = $(this).attr("id");
        value1 = $("label[for='" + value1 + "']").text();
        value1 = value1.replace( /,/,"." );

        var position11 = value1.indexOf("(");
        var position12 = value1.indexOf(")");
        position11 = position11+2;

        var newPrice1 = value1.substring(position11, position12);
        if(value1.indexOf('.') == -1) {
            newPrice1 = "0";
        }
        else {
            newPrice1 = newPrice1.substring(0,newPrice1.length - 1);
        }

        total += parseFloat(newPrice1);
    });

    $("select option:selected").each(function() {
        var value2 = $(this).text();
        value2 = value2.replace( /,/,"." );

        var position21 = value2.indexOf("(");
        var position22 = value2.indexOf(")");
        position21 = position21+2;

        var newPrice2 = value2.substring(position21, position22);
        if(value2.indexOf('.') == -1) {
            newPrice2 = "0";
        }
        else {
            newPrice2 = newPrice2.substring(0,newPrice2.length - 1);
        }

        total += parseFloat(newPrice2);
    });
}

function imageUpdate( getoptionId ) {
    var value3 = $("label[for='option-value-" + getoptionId + "']").children("img").attr("src");

    var fileNameIndex = value3.lastIndexOf("/") + 1;
    var fileName = value3.substr(fileNameIndex);

    var fileTypeStart = fileName.indexOf("50x50");
    var fileTypeEnd = fileName.indexOf("50x50")+5;
    var fileType = fileName.substring(fileTypeEnd,fileName.length);

    var plainFileName = fileName.substring(0,fileTypeStart-1);

    var fullPath = value3.indexOf(fileName);
    fullPath = value3.substring(0,fullPath);

    var newPath = fullPath.replace("cache/","");

    var newFile = newPath + plainFileName + fileType;

    $("#imageUpdate > img").attr("src",newFile);
    $("#imageUpdate > img").attr({ width: '228px', height: '228px' });
}

$('.option').change(function() {
    total = 0;
    calcTotal();

    //add the collected changed prices on top of the original price
    total = parseFloat(total) + parseFloat(OriginalPrice);
    total = total.toFixed(2);
    total = total.replace( ".","," );

    //update the price value into the related div
    $('#priceUpdate').text('<span class="price-currency">' + OriginalCurrency + '</span> ' + total);

    var optionId = $(this).find("input:checked").val();
    imageUpdate(optionId);
});

});

Надеюсь это поможет!

person Ben G    schedule 07.04.2013