Форум

carroty · #1 (**permalink**) 18.10.2013, 11:30

Здравствуйте, форумчане!
Вот такая незадача, при клике на чекбокс «Время» (all_time1) нужно внесенное значение продублировать во всех инпутах, где отмечены чекбоксы «Дни» , примерно как на картинке чекеты.jpg. По клику на all_time1 перебрать в each все значения дней и времени? А дальше заклинило))) Подскажите люди добрые мысль умную, как такое реализовать.
Благодарю за внимание!
html-форма

<form id="timetable_city" name="timetable_city" action="/admin/timetable/add-timetable-city" method="post">
<input type="hidden" name="timetable_id" value="" id="timetable_id"></dd>
<input type="checkbox" name="day_1_ukr" id="day_1_ukr" value="yes" data-rel="1">
<input type="checkbox" name="day_2_ukr" id="day_2_ukr" value="yes" data-rel="2">
<input type="checkbox" name="day_3_ukr" id="day_3_ukr" value="yes" data-rel="3">
<input type="checkbox" name="day_4_ukr" id="day_4_ukr" value="yes" data-rel="4">
<input type="checkbox" name="day_5_ukr" id="day_5_ukr" value="yes" data-rel="5">
<input type="checkbox" name="day_6_ukr" id="day_6_ukr" value="yes" data-rel="6">
<input type="checkbox" name="day_7_ukr" id="day_7_ukr" value="yes" data-rel="7">
<input type="text" name="time_1_ukr" id="time_1_ukr" value="" data-rel="1">
<input type="text" name="time_2_ukr" id="time_2_ukr" value="" data-rel="2">
<input type="text" name="time_3_ukr" id="time_3_ukr" value="" data-rel="3">
<input type="text" name="time_4_ukr" id="time_4_ukr" value="" data-rel="4">
<input type="text" name="time_5_ukr" id="time_5_ukr" value="" data-rel="5">
<input type="text" name="time_6_ukr" id="time_6_ukr" value="" data-rel="6">
<input type="text" name="time_7_ukr" id="time_7_ukr" value="" data-rel="7">
</form>
<div class="switch_checkbox all_times1">
	<input type="checkbox" class="all_time1"/>
	<label><i></i></label>
</div>

рони · #2 (**permalink**) 18.10.2013, 11:44

Сообщение от carroty

нужно внесенное значение

куда? в любой инпут?

ОлегА · #3 (**permalink**) 18.10.2013, 11:56

$(function(){
$('.all_time1').click(function(){

if($(this).is(':checked')){
      var $time = '12:30'
      $('#timetable_city input[type=checkbox]:checked').each(function(){
            index = $(this).attr('data-rel')

  $('#timetable_city input[type=text][data-rel='+index+']').val($time)
      })
} else {
  $('#timetable_city input[type=text]').val('')
}

})
})

carroty · #4 (**permalink**) 18.10.2013, 11:57

Сообщение от рони

куда? в любой инпут?

Внесенное значение из любого инпута time продублировать в тех инпутах time, где отмечены дни

рони · #5 (**permalink**) 18.10.2013, 12:20

carroty,

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
</head>

<body>
<form id="timetable_city" name="timetable_city" action="/admin/timetable/add-timetable-city" method="post">
<input type="hidden" name="timetable_id" value="" id="timetable_id">
<input type="checkbox" name="day_1_ukr" id="day_1_ukr" value="yes" data-rel="1">
<input type="checkbox" name="day_2_ukr" id="day_2_ukr" value="yes" data-rel="2">
<input type="checkbox" name="day_3_ukr" id="day_3_ukr" value="yes" data-rel="3">
<input type="checkbox" name="day_4_ukr" id="day_4_ukr" value="yes" data-rel="4">
<input type="checkbox" name="day_5_ukr" id="day_5_ukr" value="yes" data-rel="5">
<input type="checkbox" name="day_6_ukr" id="day_6_ukr" value="yes" data-rel="6">
<input type="checkbox" name="day_7_ukr" id="day_7_ukr" value="yes" data-rel="7"><br>
<input type="text" name="time_1_ukr" id="time_1_ukr" value="" data-rel="1">
<input type="text" name="time_2_ukr" id="time_2_ukr" value="" data-rel="2">
<input type="text" name="time_3_ukr" id="time_3_ukr" value="" data-rel="3">
<input type="text" name="time_4_ukr" id="time_4_ukr" value="" data-rel="4">
<input type="text" name="time_5_ukr" id="time_5_ukr" value="" data-rel="5">
<input type="text" name="time_6_ukr" id="time_6_ukr" value="" data-rel="6">
<input type="text" name="time_7_ukr" id="time_7_ukr" value="" data-rel="7">
</form>
<div class="switch_checkbox all_times1">
	<input type="checkbox" class="all_time1" />
	<label><i>Время</i></label>
</div>
<script>
var time = document.querySelector(".all_time1"),
    times = document.querySelectorAll("[id^=time_]"),
    days = document.querySelectorAll("[id^=day_]");
time.onclick = function () {
    var b = "";
    if (time.checked==!0) {
        for (var a = 0; a < times.length; a++)
            if (times[a].value) {
                b = times[a].value;
                break
            }
        for (a = 0; a < times.length; a++)!0 == days[a].checked && (times[a].value = b)
    }
};
</script>
</body>

</html>

carroty · #6 (**permalink**) 18.10.2013, 12:33

Я уже насочиняла

$('.all_time1').click(function(){
    var index = '';
    var time = '';

    if($(this).is(':checked')){
          $('#timetable_city input[type=text]').each(function(){                      
              if ($(this).val() != '')
                  {
                      time = $(this).val();
                  }
          });                
          $('#timetable_city input[type=checkbox]:checked').each(function(){
                index = $(this).attr('data-rel');

      $('#timetable_city input[type=text][data-rel='+index+']').val(time)
          })
    }
    else {
        $('#timetable_city input[type=text]').val('')
}
});

рони, у вас более правильно выглядит, спасибо за вариант
Всем спасибо за участие!

Форум

Справочник

Discord чат

Курсы javascript