Вопрос по политре на странице продукта

[serch]

Всем доброго дня!
На странице продукта при выборе цвета используется следующее

Код: [Выделить]

{elseif ($group.group_type == 'color')}
.........
<input type="hidden" class="color_pick_hidden" name="{$groupName|escape:'html':'UTF-8'}"  value="{$default_colorpicker|intval}" />
Значение в

Код: [Выделить]

value="{$default_colorpicker|intval}"Решил вывести на странице продукта при выборе иконки с цветом, файл палитры.
Файлы хранятся в папке ..\img\co\ с темже значением {$default_colorpicker|intval}
Вопрос только как при выборе иконки с цветом получить значение {$default_colorpicker|intval} и вывести файл палитры с этим значением (Значение.jpg)
Пробовал ставить через

Код: [Выделить]

<input type="hidden" class="color_pick_hidden" name="{$groupName|escape:'html':'UTF-8'}" onclick="addTableColor();" value="{$default_colorpicker|intval}" />Думал через ява скрипт загружу функцию addTableColor()
Ничего не выходит.
У кого какие соображения есть?

[DarinSr]

Код вывода палитры на странице товара

Код: [Выделить]

{if $img_color_exists}
<img src="{$img_col_dir}{$id_attribute|intval}.jpg" alt="{$colors.$id_attribute.name|escape:'html':'UTF-8'}" title="{$colors.$id_attribute.name|escape:'html':'UTF-8'}" width="20" height="20" />
{/if}

[serch]

Спасибо за ответ.
Нет так не идет. Может я не правельно объяснил.
На вкладке показано как должно быть.
При выборе иконки цвета в центральной части должно быть увеличенное изображение файла палитры.
Спасибо!

[Миколас]

В атрибуте цвет загружаются файлы с изображением цвета (палитра) или квадраты залитые одним цветом. Оба варианта загрузить нельзя.

[serch]

Спасибо всем кто ответил.
Вопрос то состоял в том что-бы не вывести оба варианта, а при выборе квадратика цвета получить его id, и по его id в центральной части страницы продукта, вывести файл палитры определенным размерам.
Решение может быть таким..
Создал переменную и функцию на странице продукта в нужном месте центральной части

Код: [Выделить]

<input type="hidden" class="exclusive_mini" name="colorr" id= "colorr"  onclick="addTableColor();" value="">

<script language="JavaScript">
function addTableColor()
 {
qty_ell = document.getElementById('colorr');
qty_ell.value = qty_ell.value+'.jpg';
alert(qty_ell.value);

    }
</script>
В product.js  добавил

Код: [Выделить]

function colorPickerClick(elt)
{........
qty_ell = document.getElementById('colorr');
qty_ell.value=(elt).attr('id').replace('color_', '');
$('.exclusive_mini').click();
}Теперь на странице продукта при выборе значка цвета я получаю значение в переменной colorr, результат во вложении, имя файла палитры.
Как теперь вывести файл палитры вместо alert(qty_ell.value) размером например width="100" height="100"
Типа как-то так

Код: [Выделить]

document.write ("<div style="width: 100px; height: 100px; background: url('../img/co/"+qty_ell.value+"')"></div>");Но так не выводит..
Спасибо.

[DarinSr]

В стандарной теме функуция определения ид атрибута цвета уже определена в файле /themes/default-bootstrap/js/product.js в colorPickerClick.

Код: [Выделить]

$(document).on('click', '.color_pick', function(e){
e.preventDefault();
colorPickerClick($(this));
getProductAttribute();
});
..Там вы можете добавить свой код.
Для показа выбранного атрибута в всплывающем окне используйте class="fancybox".
Пример можете посмотреть у картинок на странице товара.

[serch]

Спасибо большое.
Вот смотрите..
На странице продукта в месте перед

Код: [Выделить]

{if $PS_STOCK_MANAGEMENT}стоит фунуция

Код: [Выделить]

<script language="JavaScript">
function addTableColor()
 {
qty_ell = document.getElementById('suscolorr');
qty_ell.value = qty_ell.value+'.jpg';
alert(qty_ell.value);
document.location.replace("{$base_dir}img/co/"+qty_ell.value)

    }
</script>
При выборе цвета (квадратика), я получаю вывожу

Код: [Выделить]

alert(qty_ell.value);где уже есть qty_ell.value- файл палитры.
По выводу

Код: [Выделить]

document.location.replace("{$base_dir}img/co/"+qty_ell.value)Выводиться файл палитры естественно в новом окне.
Так вот задача не выводить в новом окне или в сплывающем, а вывести в этом месте в центральной части страницы продукта
перед

Код: [Выделить]

{if $PS_STOCK_MANAGEMENT} но с размерами width="100" height="100"
Может создать HOOK и вставить в это место затем как-то вывести картинку в него?
Или как..

[serch]

Если в этом месте поставить

Код: [Выделить]

<img src="{$base_dir}img/co/24.jpg" width="200" height="200" />То все как и хотелось.
Но как теперь вместо жесткого 24.jpg поставить значение из скрипта

Код: [Выделить]

qty_ell.value Или наоборот как поставить такую-же типа

Код: [Выделить]

<img src="{$base_dir}img/co/24.jpg" width="200" height="200" />в ява скрипт что-бы вевести.
Спасибо.

[Adik]

Так вот задача не выводить в новом окне или в сплывающем, а вывести в этом месте в центральной части страницы продукта
перед {if $PS_STOCK_MANAGEMENT} но с размерами width="100" height="100"

Создаете блок в шаблоне в нужном месте, в нем изображение с размерами 100х100, устанавливаете у блока dispaly:none.
При клике меняете видимость блока,  и файл изображения:

Код: [Выделить]

{$base_dir}img/co/"+qty_ell.value

[Adik]

Выводить все сразу в шаблоне, скрывать блок, в javascript менять видимостть и источник изображения.
Вот такая схема работает всегда и во всех браузерах.

[serch]

Спасибо. Приблизительно так и решил.
Поставил

Код: [Выделить]

<img id="img_colorr" src="{$base_dir}img/co/0.jpg" width="200" height="200"  />В JavaScript прописал

Код: [Выделить]

var img1 = document.getElementById('img_colorr');
img1.src = "{$base_dir}img/co/"+qty_ell.value;И все стало на свои места.

[serch]

Осталось проверить наличие файла, пробовал делать так  в скрипте....

Код: [Выделить]

String fileName = "{$base_dir}img/co/"+qty_ell.value;
if ((new File(fileName)).exists()) {
    // существует
} else {
    // не существует
}но почему-то не работает..
Может подскажите.
Спасибо.

[Adik]

С jQuery проще и без перезагрузки

Код: [Выделить]

$.ajax({
    url:'http://mysite.ru/image.jpg',
    type:'HEAD',
    error: function()
    {
        //file not exists
    },
    success: function()
    {
        //file exists
    }
});

[serch]

Всем спасибо за ответы!
Сделал через ajax...

Код: [Выделить]

$.ajax({
    url:src,
    type:'HEAD',
    error: function()
    {
    $('.img_colorr').hide();
    },
    success: function()
    {
       $('.img_colorr').show();
    }
});Вопрос закрыт!
Еще раз спасибо!