выбирая радиокнопку чекед нажатой и чекед для радио в соседнем блоке

[Xamelion]

есть блок
<tbody>
<tr>
<td>
<input type="radio" name="payment_method" value="bank_transfer" id="bank_transfer" checked="checked">

</td><td class="zame"><label for="bank_transfer">Предоплата на карту Казком.</label> <p style="float: right; margin: 0 0 0px;">Бесплатная</p></td>

<td></td>
</tr>
<tr>
<td>
<input type="radio" name="payment_method" value="bank_transfer" id="bank_transfer" checked="checked">
</td><td class="zame"><label for="bank_transfer">Предоплата на баланс телефона.</label> <p style="float: right; margin: 0 0 0px;">Бесплатная</p></td>
<td></td>
</tr>
<tr>
<td>
<input type="radio" name="payment_method" value="bank_transfer" id="bank_transfer" checked="checked">
</td><td class="zame"><label for="bank_transfer">Предоплата на Киви кошелёк.</label> <p style="float: right; margin: 0 0 0px;">Бесплатная</p></td>
<td></td>
</tr>
<tr>
<td>
<input type="radio" name="payment_method" value="cod" id="cod">
</td><td class="zame"><label for="cod">Оплата наложенным платежом при получении на почте.</label> <p style="float: right; margin: 0 0 0px;">1000 тг.</p></td>
<td></td>
</tr>
</tbody>

нужно при выборе кнопки из этой таблице изменять радиокнопку в соседней таблице на этой же странице
если выбрана id="cod" то в соседней должна выбираться id="flat.flat"
соотвественно если выбрана кнопка с id="bank_transfer" то в соседней надо активировать id="free.free" из таблицы
<tbody>
<tr>
<td>
<input type="radio" name="shipping_method" value="flat.flat" id="flat.flat" checked="checked">
</td>
<td><label for="flat.flat">Доставка наложенным платежом, казпочтой </label></td>
<td style="padding:1px!important">
</td>
<td style="text-align:right;width: 22%;"><label for="flat.flat">1000тг.</label>
</td>
</tr>
</tbody>

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

живой пример можно посмотреть http://generic.xamelion.net.ua/index.php?route=extension/quickcheckout/checkout
но для этого надо добавитить 1 товар чтоб появилось оформление.

пробовал $(function(){
if($("#cod").prop('checked')){
document.querySelector('#flat.flat .radio input').checked = true;

}else if($("#bank_transfer").prop('checked')){
document.querySelector('#free.free .radio input').checked = true;
}

}); и много всего что нашел в гугле но менять не получаеться.
пробовал и .prop и .attr но вроде после jQuery 1,8 должнео работать prop.
Заранее спасибо за помощь.

[ksa]

если выбрана кнопка с id="bank_transfer"
Начнем с того, что ИД должен быть уникальным на странице...
живой пример можно посмотреть http://generic.xamelion.net.ua/index...ckout/checkout
Тебе нужно сделать тестовый пример и выложить его тут. На нем тебе покажут некие варианты решения. ;)

[Xamelion]

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


<div class="quickcheckoutright">
<div id="shipping-method">
<div class="quickcheckout-heading"><i class="fa fa-truck"></i> Способы доставки</div>
<div class="quickcheckout-content">
<p>Выберите удобный способ доставки для данного заказа</p>
<table class="table " style="margin-bottom: 0">
<tbody>
<tr>
<td>
<input type="radio" name="shipping_method" value="free.free" id="free.free" checked="checked">
</td>
<td><label for="free.free">Бесплатная доставка</label></td>
<td style="padding:1px!important">
</td>
<td style="text-align:right;width: 22%;"><label for="free.free">0тг.</label></td>
</tr>
<tr>
<td>
<input type="radio" name="shipping_method" value="flat.flat" id="flat.flat">
</td>
<td><label for="flat.flat">Доставка наложенным платежом, казпочтой </label></td>
<td style="padding:1px!important">
</td>
<td style="text-align:right;width: 22%;"><label for="flat.flat">1000тг.</label></td>
</tr>
</tbody></table>
<input type="text" name="delivery_date" value="" class="hide">
<select name="delivery_time" class="hide"><option value=""></option></select>
<script type="text/javascript"><!--
$('#shipping-method input[name=\'shipping_method\'], #shipping-method select[name=\'shipping_method\']').on('change', function() {
if ($('#payment-address input[name=\'shipping_address\']:checked').val()) {
var post_data = $('#payment-address input[type=\'text\'], #payment-address input[type=\'checkbox\']:checked, #payment-address input[type=\'radio\']:checked, #payment-address input[type=\'hidden\'], #payment-address select, #shipping-method input[type=\'text\'], #shipping-method input[type=\'checkbox\']:checked, #shipping-method input[type=\'radio\']:checked, #shipping-method input[type=\'hidden\'], #shipping-method select, #shipping-method textarea');
} else {
var post_data = $('#shipping-address input[type=\'text\'], #shipping-address input[type=\'checkbox\']:checked, #shipping-address input[type=\'radio\']:checked, #shipping-address input[type=\'hidden\'], #shipping-address select, #shipping-method input[type=\'text\'], #shipping-method input[type=\'checkbox\']:checked, #shipping-method input[type=\'radio\']:checked, #shipping-method input[type=\'hidden\'], #shipping-method select, #shipping-method textarea');
}
$.ajax({
url: 'index.php?route=extension/quickcheckout/shipping_method/set',
type: 'post',
data: post_data,
dataType: 'html',
cache: false,
success: function(html) {
loadCart();
},

error: function(xhr, ajaxOptions, thrownError) {
alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
});
});
$(document).ready(function() {
$('#shipping-method input[name=\'shipping_method\']:checked, #shipping-method select[name=\'shipping_method\']').trigger('change');
});
//--></script></div>
</div>
<div id="payment-method">
<div class="quickcheckout-heading"><i class="fa fa-credit-card"></i>Способы оплаты
<p class="quickcheckout_payment_heading_delivery" style="float: right; margin: 0 0 0px; padding-right: 100px;">Доставка</p></div>
<div class="quickcheckout-content">
<p>Выберите способ оплаты для данного заказа</p>
<table class="table" style="margin-bottom:0">
<tbody><tr>
<td>
<input type="radio" name="payment_method" value="bank_transfer" class="bank_transfer" checked="checked">
</td><td class="zame"><label for="bank_transfer">Предоплата на карту Казком.</label> <p style="float: right; margin: 0 0 0px;">Бесплатная</p></td>
<td></td>
</tr>
<tr>
<td>
<input type="radio" name="payment_method" value="bank_transfer" class="bank_transfer" checked="checked">
</td><td class="zame"><label for="bank_transfer">Предоплата на баланс телефона.</label> <p style="float: right; margin: 0 0 0px;">Бесплатная</p></td>
<td></td>
</tr>
<tr>
<td>
<input type="radio" name="payment_method" value="bank_transfer" class="bank_transfer" checked="checked">
</td><td class="zame"><label for="bank_transfer">Предоплата на Киви кошелёк.</label> <p style="float: right; margin: 0 0 0px;">Бесплатная</p></td>
<td></td>
</tr>
<tr>
<td>
<input type="radio" name="payment_method" value="cod" class="cod">
</td><td class="zame"><label for="cod">Оплата наложенным платежом при получении на почте.</label> <p style="float: right; margin: 0 0 0px;">1000 тг.</p></td>
<td></td>
</tr>
</tbody>
</table>
<textarea name="survey" class="hide"></textarea>
<textarea name="comment" class="hide"></textarea>
<script type="text/javascript"><!--
$('#payment-method input[name=\'payment_method\'], #payment-method select[name=\'payment_method\']').on('change', function() {
$.ajax({
url: 'index.php?route=extension/quickcheckout/payment_method/set',
type: 'post',
data: $('#payment-address input[type=\'text\'], #payment-address input[type=\'checkbox\']:checked, #payment-address input[type=\'radio\']:checked, #payment-address input[type=\'hidden\'], #payment-address select, #payment-method input[type=\'text\'], #payment-method input[type=\'checkbox\']:checked, #payment-method input[type=\'radio\']:checked, #payment-method input[type=\'hidden\'], #payment-method select, #payment-method textarea'),
dataType: 'html',
cache: false,
success: function(html) {
},
error: function(xhr, ajaxOptions, thrownError) {
alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
});
});
//--></script></div>
</div>
</div>

Id заменил на класс получилось вот так

[Dilettante_Pro]

и таблицу методов доставки тогда я вообще скрою через css.
А она вообще нужна?
Если доставка однозначно определяется по способу оплаты, то зачем все эти манипуляции с таблицей доставки?

Id заменил на класс получилось вот так
Как были id="bank_transfer", так и остались

[ksa]

вот полный пример
Учись делать тестовые примеры, дабы не напрягать других... ;)

И поменяй ИД с точками на подчеркивания или минусы.

<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<script src='https://code.jquery.com/jquery-latest.js'></script>
<!--
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
$(function(){
$('#payment-method :radio').change(function(){
if ($(this).hasClass('cod')) {
$('#flat_flat').prop('checked',true);
} else {
$('#free_free').prop('checked',true);
};
});
});
</script>
</head>
<body>
<div class="quickcheckoutright">
<div id="shipping-method">
<div class="quickcheckout-heading"><i class="fa fa-truck"></i> Способы доставки</div>
<div class="quickcheckout-content">
<p>Выберите удобный способ доставки для данного заказа</p>
<table class="table " style="margin-bottom: 0">
<tbody>
<tr>
<td>
<input type="radio" name="shipping_method" value="free.free" id="free_free" checked="checked">
</td>
<td><label for="free.free">Бесплатная доставка</label></td>
<td style="padding:1px!important">
</td>
<td style="text-align:right;width: 22%;"><label for="free.free">0тг.</label></td>
</tr>
<tr>
<td>
<input type="radio" name="shipping_method" value="flat.flat" id="flat_flat">
</td>
<td><label for="flat.flat">Доставка наложенным платежом, казпочтой </label></td>
<td style="padding:1px!important">
</td>
<td style="text-align:right;width: 22%;"><label for="flat.flat">1000тг.</label></td>
</tr>
</tbody>
</table>
<input type="text" name="delivery_date" value="" class="hide">
<select name="delivery_time" class="hide"><option value=""></option></select>
</div>
</div>
<div id="payment-method">
<div class="quickcheckout-heading">
<i class="fa fa-credit-card"></i>Способы оплаты
<p class="quickcheckout_payment_heading_delivery" style="float: right; margin: 0 0 0px; padding-right: 100px;">Доставка</p>
</div>
<div class="quickcheckout-content">
<p>Выберите способ оплаты для данного заказа</p>
<table class="table" style="margin-bottom:0">
<tbody><tr>
<td>
<input type="radio" name="payment_method" value="bank_transfer" class="bank_transfer" checked="checked">
</td><td class="zame"><label for="bank_transfer">Предоплата на карту Казком.</label> <p style="float: right; margin: 0 0 0px;">Бесплатная</p></td>
<td></td>
</tr>
<tr>
<td>
<input type="radio" name="payment_method" value="bank_transfer" class="bank_transfer" checked="checked">
</td><td class="zame"><label for="bank_transfer">Предоплата на баланс телефона.</label> <p style="float: right; margin: 0 0 0px;">Бесплатная</p></td>
<td></td>
</tr>
<tr>
<td>
<input type="radio" name="payment_method" value="bank_transfer" class="bank_transfer" checked="checked">
</td><td class="zame"><label for="bank_transfer">Предоплата на Киви кошелёк.</label> <p style="float: right; margin: 0 0 0px;">Бесплатная</p></td>
<td></td>
</tr>
<tr>
<td>
<input type="radio" name="payment_method" value="cod" class="cod">
</td><td class="zame"><label for="cod">Оплата наложенным платежом при получении на почте.</label> <p style="float: right; margin: 0 0 0px;">1000 тг.</p></td>
<td></td>
</tr>
</tbody>
</table>
<textarea name="survey" class="hide"></textarea>
<textarea name="comment" class="hide"></textarea>
</div>
</div>
</div>
</body>
</html>

[ksa]

Если доставка однозначно определяется по способу оплаты, то зачем все эти манипуляции с таблицей доставки?
Поддерживаю. :yes:

[Dilettante_Pro]

Xamelion,
Интересно, как вы планируете различать, какой из этих пунктов выбран? По лейблу?
<tr>
<td>
<input type="radio" name="payment_method" value="bank_transfer" class="bank_transfer" checked="checked">
</td>
<td class="zame">
<label for="bank_transfer">Предоплата на карту Казком.</label>
<p style="float: right; margin: 0 0 0px;">Бесплатная</p>
</td>
<td></td>
</tr>
<tr>
<td>
<input type="radio" name="payment_method" value="bank_transfer" class="bank_transfer" checked="checked">
</td>
<td class="zame">
<label for="bank_transfer">Предоплата на баланс телефона.</label>
<p style="float: right; margin: 0 0 0px;">Бесплатная</p>
</td>
<td></td>
</tr>

[Xamelion]

Xamelion,
Интересно, как вы планируете различать, какой из этих пунктов выбран? По лейблу?
<tr>
<td>
<input type="radio" name="payment_method" value="bank_transfer" class="bank_transfer" checked="checked">
</td>
<td class="zame">
<label for="bank_transfer">Предоплата на карту Казком.</label>
<p style="float: right; margin: 0 0 0px;">Бесплатная</p>
</td>
<td></td>
</tr>
<tr>
<td>
<input type="radio" name="payment_method" value="bank_transfer" class="bank_transfer" checked="checked">
</td>
<td class="zame">
<label for="bank_transfer">Предоплата на баланс телефона.</label>
<p style="float: right; margin: 0 0 0px;">Бесплатная</p>
</td>
<td></td>
</tr>

первые три способа оплаты идут с бесплатной доставкой и с одним классом , а последний способ оплаты с лейбл с отдельным классом. вы этого не видите?

[Xamelion]

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

[Xamelion]

поменять id="free.free" и id="flat.flat" формируется где-то с помощью php который я вообще не понимаю( и к нему привязан уже написанный код моделя, прийдется еще и его искать как менять.
решая одну задачу создам кучу новых.
Помогите пожалуйста с кодом для выбора если выбирается кнопка с классом class="bank_transfer" в таблице доставки выбирается бесплатная доставка то есть первая радиокнопка, если выбирается кнопка с классом class="cod" то из таблицы выбираеться так одновременно с ней Доставка наложенным платежом, то есть вторая кнопка.

[Dilettante_Pro]

первые три способа оплаты идут с бесплатной доставкой и с одним классом
Как вы узнаете, который из них выбран? или для вас это не имеет значения?

[Dilettante_Pro]

Помогите пожалуйста с кодом для выбора если выбирается кнопка с классом class="bank_transfer" в таблице доставки выбирается бесплатная доставка то есть первая радиокнопка, если выбирается кнопка с классом class="cod" то из таблицы выбираеться так одновременно с ней Доставка наложенным платежом, то есть вторая кнопка.

ksa же ответил в пост 5

[Xamelion]

а обойти переназываение id можно? так как я не представляю как их переделать на "-" или "_"

[Dilettante_Pro]

Xamelion,
css селекторы воспринимают точку как начало названия класса, поэтому
$('#free.free') будет искать элемент с id='free' class='free'.
Так что надо менять.
Например, так, если не можете поменять на сервере (???):
<div id='free.free'></div>
<script>
var item = document.getElementById('free.free');
item.id = item.id.replace(/\./g,'_');
alert(item.id);
</script>

[Dilettante_Pro]

Или так - оптом
<input type='radio' id='free.free'>
<input type='radio' id='simpleid'>
<input type='radio' id='flat.flat'>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<script>
$('input[type="radio"]').each(function (i,item) {
item.id = item.id.replace(/\./g,'_');
alert(item.id)
});
</script>

[Xamelion]

алерт не хочет отрабатывать у меня на страничке( и соотвественно весь код не работает( я так понимаю конфликт какой-то... Хотя jquery.min вроде один подключен... но почему алерт и обычный js нормально не работает?! варианты куда смотреть подскажите?

[Dilettante_Pro]

Xamelion,
Алерт только для контроля - его можно убрать. Смотрите F12- инструменты разработчика-Консоль. Есть сообщения об ошибках?
Этот скрипт должен выполняться после загрузки страницы до выполнения других скриптов.

[Xamelion]

короче у меня не выходит кто может помочь сделать напишите в личку сумму, не получается у меня, там аяксом все формируется и у меня пока не хватает опыта и знаний

[Dilettante_Pro]

там аяксом все формируется
Покажите скрипт аякс-запроса, который грузит эти таблицы