Вот код js
<script type="text/javascript">
$(document).ready(function(){
<?if (isset($_REQUEST["REPLIER_FORM_CLICK"])){?>
$('.AddReview').click();
<?}?>
<?if(!empty($arResult['SIZES_OPTIONS'])):?>
var size_option = JSON.parse('<?=$arResult['SIZES_OPTIONS']?>');
<?else:?>
var size_option = [];
<?endif;?>
<?if(!empty($arResult['MATERIAL_SIZE'])):?>
var size_material = JSON.parse('<?=$arResult['MATERIAL_SIZE']?>');
<?else:?>
var size_material = [];
<?endif;?>
<?if(!empty($arResult['DEFAULT_OFFER'])):?>
var default_offer = JSON.parse('<?=$arResult['DEFAULT_OFFER']?>');
<?else:?>
var default_offer = [];
<?endif;?>
function selectSize(size) {
$('.js-sizeRadio').removeAttr('checked');
$('.js-sizeRadio[value=' + size + ']').attr('checked', 'checked');
$('.js-sizeRadio').trigger('change');
}
function selectMaterial(material) {
$('.js-material').val(material);
$('.js-material').trigger('change');
}
function enableSizes(material) {
$('.js-sizeRadio').attr('disabled', 'disabled');
var selected = $('.js-sizeRadio:checked').val();
var last_key = 0;
a = size_material[material];
findSelected = false;
for (key in a) {
if (a.hasOwnProperty(key)) {
if(key === selected) {
findSelected = true;
}
$('.js-sizeRadio[value="' + key + '"]').removeAttr('disabled');
last_key = key;
}
}
if(!findSelected) {
selectSize(last_key);
}
}
function enableMaterials(size) {
$('.js-SelectMaterialsSection > option').attr('disabled','disabled');
var selected = $('.js-SelectMaterialsSection').val();
var last_key = 0;
findSelected = false;
for (key in size_material) {
if (size_material[key].hasOwnProperty(size)) {
if(key === selected) {
findSelected = true;
}
$('.js-SelectMaterialsSection > option[value="' + key + '"]').removeAttr('disabled');
last_key = key;
}
}
if(!findSelected) {
selectMaterial(last_key);
return last_key;
}
return selected;
}
function selectMaterialItem(item) {
$('.product-detail-choose-list > li').removeClass('selected');
if(item){
$('.product-detail-choose-list > li[rel="'+ item +'"]').addClass('selected');
}
}
function showMaterials(material) {
$('.product-detail-choose-list').hide();
$('.mats-' + material).show();
selectMaterialItem(false);
}
function getOptionCost(size) {
var opts = $('.js-option:checked');
if(opts.length == 0) {
return 0;
}
cost = 0;
for (var i = opts.length - 1; i >= 0; i--) {
cost += parseInt(size_option[size][$(opts[i]).val()]);
};
if(isNaN(cost)) {
cost = 0;
}
return cost;
}
function getMaterialItem(){
var mi = $('.product-detail-choose-list > li.selected');
if(mi.length <= 0) {
return 0;
}
return mi.attr('rel');
}
function showPrice(size, material) {
var optionCosts = getOptionCost(size);
var itemPrice = parseInt(size_material[material][size]);
var price = optionCosts + itemPrice;
$('.total_cost').html(price);
}
function enableOptions(size) {
$('.js-option').attr('disabled','disabled');
if(!size_option.hasOwnProperty(size)) {
return false;
}
for (key in size_option[size]) {
if (size_option[size].hasOwnProperty(key) && size_option[size][key] > 0) {
$('.js-option[value="' + key + '"]').removeAttr('disabled');
$('#price-' + key).html(" +" + size_option[size][key] + " руб.");
}
else
{
$('#price-' + key).html("");
}
}
removeDisabledOptions();
}
function removeDisabledOptions()
{
$('.js-option:checked').each(function(index, el){
var attr = $(this).attr('disabled');
if (attr == "disabled") {
$(el).attr("checked", false);
}
});
}
function getSize() {
return $('.js-sizeRadio:checked').val();
}
function getMaterial(){
return $('.js-SelectMaterialsSection').val();
}
function getOptions(){
var opt = [];
$.each($('.js-option:checked'), function(k, v){
opt.push($(v).val());
});
return opt;
}
function formPopulate(post){
$('.js-quantity').val(post.quantity);
$('.js-material-id').val(post.material);
$('.js-offer-code').val(post.offer_code);
$('.js-options-form-container').html('');
for (var i = post.options.length - 1; i >= 0; i--) {
var el = $('<input type="hidden" name="options[]" value="' + post.options[i] + '"/>');
el.appendTo('.js-options-form-container');
};
}
selectSize(default_offer['SIZE']);
selectMaterial(default_offer['MATERIAL']);
enableSizes(default_offer['MATERIAL']);
enableMaterials(default_offer['SIZE']);
enableOptions(default_offer['SIZE']);
showMaterials(default_offer['MATERIAL']);
showPrice(default_offer['SIZE'], default_offer['MATERIAL']);
$('.js-SelectMaterialsSection').change(function(){
enableSizes($(this).val());
showMaterials($(this).val());
showPrice(getSize(),getMaterial());
});
$('.js-sizeRadio').click(function(){
var id = enableMaterials($(this).val());
enableOptions($(this).val());
selectMaterial(id);
showMaterials(id);
showPrice(getSize(),getMaterial());
});
$('.product-detail-choose-list > li').mousedown(function(ev){
$(this).find('span').css('background-color', '#fff');
$(this).find('span').css('color', '#4d6192');
});
$('.product-detail-choose-list > li').mouseup(function(ev){
$(this).find('span').css('background-color', '#4d6192');
$(this).find('span').css('color', '#fff');
});
$('.product-detail-choose-list > li').click(function(){
selectMaterialItem($(this).attr('rel'));
});
$('.js-option').click(function(){
showPrice(getSize(),getMaterial());
});
$('.product-detail-submit').click(function(ev){
ev.preventDefault();
if(getMaterialItem() <= 0) {
alert('Пожалуйста, выберите обивочный материал');
return false;
}
post = {};
post.quantity = 1;
post.offer_code = '<?=$arResult['ID']?>_' + getMaterial() + '_' + getSize();
post.options = getOptions();
post.material = getMaterialItem();
formPopulate(post);
return $(this).parents('form').submit();
});
$('.input-select').chosen();
$('a.AddReview').fancybox({
'width': '620'
});
$('a.fancybox-img').fancybox(
{'width': 'auto'});
});
</script>
Простой
Средний