[denis_savin]

Помогите пожлуйста в реализации данного функционала в tpl-шаблонизаторе.
Попробовал прикрутить из статьи для xslt, но что то ничего не вышло(

Использую не радио кнопки, а селекты.

[ilyar]

Опиши подробнее что хочешь сделать и что не получается.

[denis_savin]

Опиши подробнее что хочешь сделать и что не получается.

Мне надо что бы при выборе опционального свойства менялась основлная цена (динамически).

Есть в опциональных свойствах спец. поле, где указывается цена.
Когда выбираешь это опциональное свойство, в нем пишется 34р. то есть прибавление к основной цене 34 рубля. Я хоче что бы при выборе такого опционального свойства цена менялась (что бы пользователь знал окончательную цену товара).

Что делал:
За основу взял статью с wiki: http://wiki.umisoft.ru/Динамическое_обновление_цены_при_выборе_опционных_свойств
Там рассказывается про xslt шаблонизатор с использованием radio check.
Я решил попробовать сделать на tpl с использованием select.
Что наделал(файл вывода опциональных свойств:

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

<?php
$FORMS = array();


$FORMS['group'] = <<<END

<form id="basket_%id%" action="%pre_lang%/emarket/basket/put/element/%id%/" method="get" >

<span>%lines%</span>
<p>%emarket basketAddLink()%</p>
</form>

END;

$FORMS['group_line'] = <<<END
   
    	%prop%
    
END;

$FORMS['optioned_block'] = <<<END
<strong>%title%:</strong><br>
<span id="price_id">
	<select name="options[%field_name%]" >
	%items% 
	</select>
</span>
<script type="text/javascript"> var original_price = parseFloat($('#price_id').text(), 10); </script>
<br>

END;

$FORMS['optioned_block_empty'] = <<<END

<br/><br/>
END;

$FORMS['optioned_item'] = <<<END

	
	<option value="%object-id%" onClick="var value1 = parseFloat($(this).parent().parent().children('td:last-child').html()); $('#price_id').html( value1 + original_price );">
		%object-name% %emarket applyPriceCurrency(%float%, 'short')%
	</option>
	

END;

?>

Не хочет он пересчитывать цену динамически:( 

[ilyar]

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

Не могу сказать по твоему коду у меня мало TPL практики, а приведенный шаблон не полный, но вижу одну ошибку:  <span id="price_id">, что бы разобраться что не так советую смотреть в конслоль для этого очень хорошо подходит Chrome DevTools, вот замечательный курс на эту тему, он на английском, но видео интуитивно понятно, за 2 часа вполне можно освоить этот скил.
 
В твой задаче нет ничего сложного XSLT или TPL не важно. В общем виде тебе надо  построить правильную html структуру, что бы сне было удобно работать из JavaScript, например вот так:

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

<form class="item" data-item-id="123" method="get">
  <div class="item__name">Наименование товара Б</div>
  <select class="item__option" name="options[field_name]">
    <option>опции</option>
    <option value="1" data-original-price="9.55">опция А +9.55 руб.</option>
    <option value="2" data-original-price="19.55">опция Б +19.55 руб.</option>
    <option value="3" data-original-price="29.55">опция В +29.55 руб.</option>
  </select>
  <button class="price">
    <div class="price__value" data-original-price="100">100</div>
    <div class="price__suffix">руб.</div>
  </button>
</form>

далее при выборе опции, обновляем отображение стоимости:

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

jQuery('.item').change(function () {
  var target = $('.price__value', this);
  var itemPrice = parseFloat(target.data('original-price'));
  var optionPrice = parseFloat($('.item__option option:selected', this).data('original-price'));
  target.html(itemPrice + optionPrice);
});

Демка http://bit.ly/itemAddOptionPrice

Думаю понятно как это внедрить в TPL шаблон, пиши если будут вопросы.

[denis_savin]

Сделал все так же как вы мне посоветовали, но ничего не меняется(
Скрипт запихал в header
Вот код в браузере:

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

<div class="price w100">
<strong>Цена опт.:</strong>
<span class="price__value" data-original-price="459">459</span><span class="red">руб.</span>
</div>

<select name="options[razmer_navolochki]" class="item__option">
<option value="6893" data-original-price="">50 х 70</option>
<option value="6894" data-original-price="35">70 х 70 +35 руб</option>
</select>

Так же приводу ко файла где то все сделано:

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

<?php
$FORMS = array();


$FORMS['group'] = <<<END

<form id="basket_%id%" action="%pre_lang%/emarket/basket/put/element/%id%/" method="get" >

<span>%lines%</span>
<p>%emarket basketAddLink()%</p>
</form>

END;

$FORMS['group_line'] = <<<END
   
    	%prop%
    
END;

$FORMS['optioned_block'] = <<<END
<strong>%title%:</strong><br>

	<select name="options[%field_name%]" class="item__option">
	%items% 
	</select>
	

<br>

END;

$FORMS['optioned_block_empty'] = <<<END
<!--<strong>%title%</strong> - Нет опций-->
<br/><br/>
END;

$FORMS['optioned_item'] = <<<END


	
	<option value="%object-id%" data-original-price="%emarket applyPriceCurrency(%float%, 'price')%">
		%object-name% %emarket applyPriceCurrency(%float%, 'short')%
	</option>
	

END;

?>

И код файла вывода цены:

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

$FORMS['price'] = <<<END

<strong>Цена опт.:</strong>
<span class="price__value" data-original-price="%value%">%value%</span><span class="red">руб.</span>

END;

[ilyar]

смотри вставил в демо твою структуру html http://bit.ly/itemAddOptionPrice работает, может быть jQuery не подключаешь... если это так то в логе будет обязательно ошибка, что вообще лог говорит?

[denis_savin]

jQuery подключен.
А можно поподробнее насчет консоли chrome?
не понимаю как с помощью нее посмотреть где ошибка и вообще отрабатывает ли функция.

[ilyar]

Конслоль это часть Chrome DevTools, я писал о нем ранее, вот замечательный курс на эту тему (см. четвертый урок), он на английском, но видео интуитивно понятно, за 2 часа вполне можно освоить этот инструмент.

Еще есть статья Chrome DevTools: Using the Console, автор Tim Statler, перевод Использование консоли Google Chrome, переводчик Владимир Старков.