Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 22.09.2017, 01:01
Интересующийся
Отправить личное сообщение для vano_mig Посмотреть профиль Найти все сообщения от vano_mig
 
Регистрация: 20.09.2017
Сообщений: 10

Область видимости переменной
Всем привет, есть код с разными типами чекбоксов. Для одноого типа все работает ок. Но когда добавляю остальные в мой массив не записываються значения инпутов. Подскажите где обибка...
<div class="filterWrap isOpened">
					<div class="filterHead">Мастер</div>
					<ul class="filterBody autor">
						<li>
							<input type="checkbox" class="checkbox filter1" name="autor[]" value="1" id="filter_ch_1">
							<label for="filter_ch_1">Рейпольский А.Д.</label>
						</li>
						<li>
							<input type="checkbox" class="checkbox filter1" name="autor[]" value="3" id="filter_ch_2">
							<label for="filter_ch_2">Митков Павел</label>
						</li>
						<li>
							<input type="checkbox" class="checkbox filter1" name="autor[]" value="2" id="filter_ch_3">
							<label for="filter_ch_3">Рудаева Е.Л.</label>
						</li>
						<li>
							<input type="checkbox" class="checkbox filter1" name="autor[]" value="4" id="filter_ch_4">
							<label for="filter_ch_4">Уркинеев Д.Л.</label>
						</li>
						<li>
							<input type="checkbox" class="checkbox filter1" name="autor[]" value="5" id="filter_ch_5">
							<label for="filter_ch_5">Гусев Валерий</label>
						</li>
					</ul>
				</div>
				<div class="filterWrap isOpened">
					<div class="filterHead">Категория</div>
					<ul class="filterBody">
						<li>
							<input type="checkbox" class="checkbox filter1" name="category[]" value="1" id="filter_cc_1">
							<label for="filter_cc_1">Живопись</label>
						</li>
						<li>
							<input type="checkbox" class="checkbox filter1" name="category[]" value="2" id="filter_cc_2">
							<label for="filter_cc_2">Графика</label>
						</li>
						<li>
							<input type="checkbox" class="checkbox filter1" name="category[]" value="3" id="filter_cc_3">
							<label for="filter_cc_3">Изделия</label>
						</li>
					</ul>
				</div>
				<div class="filterWrap isOpened">
					<div class="filterHead">Техника</div>
					<ul class="filterBody">
						<li>
							<input type="checkbox" class="checkbox filter1" name="style[]" value="1" id="filter_ct_1">
							<label for="filter_ct_1">Карандаш</label>
						</li>
						<li>
							<input type="checkbox" class="checkbox filter1" name="style[]" value="2" id="filter_ct_2">
							<label for="filter_ct_2">Акрил</label>
						</li>
						<li>
							<input type="checkbox" class="checkbox filter1" name="style[]" value="3" id="filter_ct_3">
							<label for="filter_ct_3">Акварель</label>
						</li>
						<li>
							<input type="checkbox" class="checkbox filter1" name="style[]" value="4" id="filter_ct_4">
							<label for="filter_ct_4">Масло</label>
						</li>
						<li>
							<input type="checkbox" class="checkbox filter1" name="style[]" value="5" id="filter_ct_5">
							<label for="filter_ct_5">Тушь</label>
						</li>
						<li>
							<input type="checkbox" class="checkbox" name="style[]" value="6" id="filter_ct_6">
							<label for="filter_ct_6">Каменая живопись</label>
						</li>
					</ul>
				</div>

$('.filter1').on('click', function()
	{
		var arr = [];
		var cat = [];
		var style = [];
		if ($('.autor input[type=checkbox]').on('change'))
		{
			$('.autor input[type=checkbox]').on('change', function()
			{
				$('input[name="autor[]"]:checked').each(function() {
					arr.push($(this).val());
				})
			})
			console.log(arr)
		}
		else if ($('.category input[type=checkbox]').on('change'))
		{
			$('.category input[type=checkbox]').on('change', function()
			{
				$('input[name="category[]"]:checked').each(function() {
					cat.push($(this).val());
				})
			})
		}
		else if ($('.style input[type=checkbox]').on('change'))
		{
			$('.style input[type=checkbox]').on('change', function()
			{
				$('input[name="style[]"]:checked').each(function() {
					style.push($(this).val());
				})
			})
		}
		if (arr.lenght == 0)
		{
			arr.push(val('none'));
		}
		if (cat.lenght == 0)
		{
			cat.push('none');
		}
		if (style.lenght == 0)
		{
			style.push(0);
		}
		
				$.ajax({
		 			url: '/filter',
		 			data: {arr: arr, cat: cat, style: style},
		 			type: 'GET',
		 			success: function(filter) {

		 				var responce = jQuery.parseJSON(filter);
		 				if (responce != "") {
		 					console.log(filter);
			 			 	$('.category_item').css('display', 'none');
			 			 	$('.category_items').append(responce.prod);
			 			} 
		 			},
		 			error: function() {
		 				alert("Ошибка подключения!");
		 			}
				})
	});
Ответить с цитированием
  #2 (permalink)  
Старый 22.09.2017, 15:22
Профессор
Отправить личное сообщение для Dilettante_Pro Посмотреть профиль Найти все сообщения от Dilettante_Pro
 
Регистрация: 27.11.2015
Сообщений: 2,899

vano_mig,
Интересно, а что это вы проверяете?
if ($('.category input[type=checkbox]').on('change'))

что за .category?

И почему назначаете обработчики на изменение после клика по чекбоксу?
Ответить с цитированием
  #3 (permalink)  
Старый 22.09.2017, 22:12
Интересующийся
Отправить личное сообщение для vano_mig Посмотреть профиль Найти все сообщения от vano_mig
 
Регистрация: 20.09.2017
Сообщений: 10

может я неправильно что то сделал, я новичек в js но хотел написать код фильтрации продуктов по разным параметрам из разных категорий.
Согласен с
($('.category input[type=checkbox]')
это бред. А как правильно разделить чекбоксы?
Ответить с цитированием
  #4 (permalink)  
Старый 22.09.2017, 23:32
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

vano_mig,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

  <script>
$(function() {
$('.filter1').on('click', function(){
var data = {arr: '[name="autor[]"]:checked', cat: '[name="category[]"]:checked', style: '[name="style[]"]:checked'};
Object.keys(data).forEach(function (key) {
  var el = document.querySelectorAll(data[key]);
  //!el.length && (el = [{value : 'none'}])
  data[key] = [].map.call(el, function(el) {
       return el.value
  });
});

alert(JSON.stringify(data));
/*

$.ajax({
     			url: '/filter',
     			data: data,
     			type: 'GET',
                dataType :  'json',
     			success: function(filter) {

     				var responce = filter;
     				if (responce != "") {
     					console.log(filter);
       			 	$('.category_item').css('display', 'none');
       			 	$('.category_items').append(responce.prod);
       			}
     			},
     			error: function() {
     				alert("Ошибка подключения!");
     			}
        })

        */




});




});
  </script>
</head>

<body>
<div class="filterWrap isOpened">
          <div class="filterHead">Мастер</div>
          <ul class="filterBody autor">
            <li>
              <input type="checkbox" class="checkbox filter1" name="autor[]" value="1" id="filter_ch_1">
              <label for="filter_ch_1">Рейпольский А.Д.</label>
            </li>
            <li>
              <input type="checkbox" class="checkbox filter1" name="autor[]" value="3" id="filter_ch_2">
              <label for="filter_ch_2">Митков Павел</label>
            </li>
            <li>
              <input type="checkbox" class="checkbox filter1" name="autor[]" value="2" id="filter_ch_3">
              <label for="filter_ch_3">Рудаева Е.Л.</label>
            </li>
            <li>
              <input type="checkbox" class="checkbox filter1" name="autor[]" value="4" id="filter_ch_4">
              <label for="filter_ch_4">Уркинеев Д.Л.</label>
            </li>
            <li>
              <input type="checkbox" class="checkbox filter1" name="autor[]" value="5" id="filter_ch_5">
              <label for="filter_ch_5">Гусев Валерий</label>
            </li>
          </ul>
        </div>
        <div class="filterWrap isOpened">
          <div class="filterHead">Категория</div>
          <ul class="filterBody">
            <li>
              <input type="checkbox" class="checkbox filter1" name="category[]" value="1" id="filter_cc_1">
              <label for="filter_cc_1">Живопись</label>
            </li>
            <li>
              <input type="checkbox" class="checkbox filter1" name="category[]" value="2" id="filter_cc_2">
              <label for="filter_cc_2">Графика</label>
            </li>
            <li>
              <input type="checkbox" class="checkbox filter1" name="category[]" value="3" id="filter_cc_3">
              <label for="filter_cc_3">Изделия</label>
            </li>
          </ul>
        </div>
        <div class="filterWrap isOpened">
          <div class="filterHead">Техника</div>
          <ul class="filterBody">
            <li>
              <input type="checkbox" class="checkbox filter1" name="style[]" value="1" id="filter_ct_1">
              <label for="filter_ct_1">Карандаш</label>
            </li>
            <li>
              <input type="checkbox" class="checkbox filter1" name="style[]" value="2" id="filter_ct_2">
              <label for="filter_ct_2">Акрил</label>
            </li>
            <li>
              <input type="checkbox" class="checkbox filter1" name="style[]" value="3" id="filter_ct_3">
              <label for="filter_ct_3">Акварель</label>
            </li>
            <li>
              <input type="checkbox" class="checkbox filter1" name="style[]" value="4" id="filter_ct_4">
              <label for="filter_ct_4">Масло</label>
            </li>
            <li>
              <input type="checkbox" class="checkbox filter1" name="style[]" value="5" id="filter_ct_5">
              <label for="filter_ct_5">Тушь</label>
            </li>
            <li>
              <input type="checkbox" class="checkbox" name="style[]" value="6" id="filter_ct_6">
              <label for="filter_ct_6">Каменая живопись</label>
            </li>
          </ul>
        </div>

</body>
</html>
Ответить с цитированием
  #5 (permalink)  
Старый 23.09.2017, 13:03
Интересующийся
Отправить личное сообщение для vano_mig Посмотреть профиль Найти все сообщения от vano_mig
 
Регистрация: 20.09.2017
Сообщений: 10

Спасибо!
Ответить с цитированием
Ответ


Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Помогите пож с JSON, передача id ссылки. wisma jQuery 22 10.02.2014 15:36
Область видимости переменной jquery Prazdnic Общие вопросы Javascript 7 04.01.2013 19:17
Область видимости переменной в Javascript dadli Общие вопросы Javascript 8 29.01.2012 17:39
Область видимости переменной ацкий Общие вопросы Javascript 3 27.08.2011 14:09
Область видимости переменной. noumo Events/DOM/Window 3 03.12.2009 23:48