Показать сообщение отдельно
  #3 (permalink)  
Старый 23.06.2019, 16:19
Аспирант
Отправить личное сообщение для nathan111777 Посмотреть профиль Найти все сообщения от nathan111777
 
Регистрация: 12.05.2019
Сообщений: 44

Вообще не то, во-первых у меня отдельный JSON файл, а в этом примере массив в файле JS, вторых в примере вашем индексный масив а у меня асоциативний, и самое главное такому новичку как я такой сложный код как вы сбросили адаптировать под свой код это что-то из области фантастики. Надеюсь на то, что кто-то редактирует мой код и соединит этот JS:

$('document').ready(function(){
    loadGoods();
});

function loadGoods() {
    //загружаю товары на страницу
    $.getJSON('goods.json', function (data) {
        //console.log(data);
        var out = '';
        for (var key in data){
            out+='<div class="single-goods">';
            out+='<h3>'+data[key]['name']+'</h3>';
            out+='<p>Цена: '+data[key]['cost']+'</p>';
            out+='<img src="'+data[key].image+'">';
            out+='<button class="add-to-cart" data-art="'+key+'">Купить</button>';
            out+='</div>';
        }
        $('#goods').html(out);
        $('button.add-to-cart').on('click', addToCart);
    });
}


+с этим js кодом(редактировав его что б он фильтровал не в html по класу а в json по свойству

var allProducts = document.getElementsByClassName('placeholder');
var checkboxes = document.querySelectorAll('input[type="checkbox"]');
var selected_countries = [];

// отобразить все товары
document.getElementsByClassName('btn-filter')[0].addEventListener('click', function(){
  for(var i = 0; i < allProducts.length; i++) {
    allProducts[i].style.display = 'block';
  }
});

// ловим клики по чекбоксам
for(var k = 0; k < checkboxes.length; k++) {
  checkboxes[k].addEventListener('click', function(){
    showHideProducts(this);
  });
}

// и скрываем или отображаем соответственные ячейки товаров
function showHideProducts(thisInput) {

  if(thisInput.checked == true) { // при проставлении галки
    // добавляем страну в массив выбранных стран
    selected_countries.push(thisInput.value);

  } else { // а при снятии галки

    var index = selected_countries.indexOf(thisInput.value);
    if(index > -1) {

      // удаляем страну с массива
      selected_countries.splice(index, 1);
    }
  }

  for(var i = 0; i < allProducts.length; i++) {

    // берем второй класс ячейки товара т.е. его страну
    var secondClass = allProducts[i].className.split(' ')[1];

    // если второй класс ячейки товара (страна) НЕ содержится в массиве выбранных стран
    if(!~selected_countries.indexOf(secondClass)) {

      allProducts[i].style.display = 'none'; // тогда скрываем ячейку

    } else { // а если содержится
      allProducts[i].style.display = 'block'; // тогда отображаем
    }
  }
}

Последний раз редактировалось nathan111777, 23.06.2019 в 16:23.
Ответить с цитированием