1

Всем бодрого дня. Имеется группа input radio. Также на странице есть модальное окно, на котором продублирована та же группа радиокнопок. Есть ли возможность продублировать выбор радио с основной страницы на модал? Т.е., например, выбрав первый пункт радио на странице и потом нажав на кнопку модала пользователь увидел на модале первый пункт уже выбранным?

<!-- Страница -->
<label class="select-rate">
    <input type="radio" name="select-rate-radio" value="option1">Онлайн
</label>
<label class="select-rate">
    <input type="radio" name="select-rate-radio" value="option2">Оффлайн
</label>
<!-- Всплывающее окно -->
<label class="select-rate">
    <input type="radio" name="select-rate-radio" value="option1">Онлайн
</label>
<label class="select-rate">
    <input type="radio" name="select-rate-radio" value="option2">Оффлайн
</label>

1 ответ 1

0

Один из вариантов решения задачи:

<!-- Страница -->
<div id=content>
<label class="select-rate">
    <input type="radio" name="select-rate-radio" value="option1">Онлайн
</label>
<label class="select-rate">
    <input type="radio" name="select-rate-radio" value="option2">Оффлайн
</label>
</div>
<!-- Всплывающее окно -->
<div id=modal>
<label class="select-rate">
    <input type="radio" name="select-rate-radio" value="option1">Онлайн
</label>
<label class="select-rate">
    <input type="radio" name="select-rate-radio" value="option2">Оффлайн
</label>
</div>

<div id=fancy>имитация кнопки попапа</div>

CSS

#fancy {
  cursor:pointer;
    margin-top:10px;
}

#modal {
  display:none
}

JQUERY

$('#fancy').click(function() {
  var m = $('#modal').children('label').children();
  var c = $('#content').children('label').children();
  for (var i = 0; i < m.length; i++) {
    switch($(c[i]).prop('checked'))
    {
      case true:
        $(m[i]).trigger('click');
        break;
    }
  } 
  $('#modal').show();
});

Ссылка на рабочий пример http://codepen.io/anon/pen/BjyaEg

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.