VM 2.x как вывести текст radio customfields в div ???

silmarion

Полезный
Регистрация
21 Июн 2012
Сообщения
194
Реакции
19
Добрый день. Собственно, вопрос в теме.

Имеется к примеру вот такая страница:


Необходимо, чтобы при выборе цвета, в блоке отображался текст radio-кнопки

К примеру - по умолчанию стоит первый цвет - хром.
В блоке надпись:
Выбран цвет: Хром

Кликаешь по другому -
Выбран цвет: Бронза
Выбран цвет: Золото
и т.д.

Нашел такое решение :
Код:
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>

<style type="text/css">
</style>
<script type="text/javascript">
$(document).ready(function (){
   $('input:radio').click(function (){
     var val=$(this.parentNode).text();
     var id=$(this).parents('table').attr('id');
     id='result_'+id
     $('#'+id).text(val);
   });
});
</script>
</head>
<body>
<table id="radio_param" >
   <tr>
     <td>
       <label><input id="radio_param_0" type="radio" name="group_param" value="0">Название Param0</label>
     </td>
   </tr>
   <tr>
     <td>
       <label><input id="radio_param_1" type="radio" name="group_param" value="1">Название Param1</label>
     </td>
   </tr>
</table>
<table id="radio_taram" >
   <tr>
     <td>
       <label><input id="radio_taram_0" type="radio" name="group_taram" value="0">Название Taram0</label>
     </td>
   </tr>
   <tr>
     <td>
       <label><input id="radio_taram_1" type="radio" name="group_taram" value="1">Название Taram1</label>
     </td>
   </tr>
</table>
<div class='result'>
     <p id='result_radio_param'></p>
     <p id='result_radio_taram'></p>
</div>
</body>
</html>

Не могу понять как его адаптировать под мои radio-box из customfields.

Код:
<style>
.product-fields .other-customfield img  {max-width:45px}
.product-fields .product-field input[type="radio"]{display:none}
.product-fields .product-field label.other-customfield {width:90px;float:left}
.product-fields .product-field label.other-customfield {width:90px;float:left}
.product-fields .other-customfield .vm-img-desc {font-size: 12px; display: block;}
.on {   color: red;font-weight:bold}
 </style>

<script type="text/javascript">
jQuery(document).ready(function() {
   jQuery('.other-customfield :radio:checked').each(function (){
     jQuery(this).parent().addClass('on');
   });
   jQuery('.product-field-display label').click(function (){
     jQuery('.product-field-display label').removeClass('on'),
   jQuery(this).addClass('on');
   });
});
</script>

     

         <?
     if (!empty($this->product->customfieldsCart)) {       ?>
     <div style="padding:10px;background:#eaeaea;border:2px solid #cdcdcd;bor…rgin-top:-3px;color:#404040;font-size:12px;font-family:Arial;float:left">
       123
       </div>
       
     <div style="position:absolute;width:447px;margin-top:320px;width:447px;margin-left:-300px;float:left;color:#404040">
       <h3 style="font-size:120%;margin-left:-20px">Выберите цвет:</h3>
       <div class="product-fields" id="righthere">
       <?php foreach ($this->product->customfieldsCart as $field) { ?>
       <div class="product-field product-field-type-<?php echo $field->field_type ?>">
       <span class="product-field-display"><?php echo $field->display ?></span>
       </div></div>   
       <?php }} ?>

       </form>
</div>
     
         <div class="clear"></div>
Или может кто-то встречал другое решение?
 
Назад
Сверху