Olá,
Pessoal preciso de um help, tenho um select filter que até ontem estava funcionando, alguém mexeu e parou de funcionar, como não entendo muito de jquery, resolvi perguntar aqui.
Obs: O arquivo jquery continua sendo chamado normalmente.
Quando o usuário seleciona todas as cidades, obviamente o sistema lista tudo, mas quando ele clica seleciona alguma, só é exibido o resultado da cidade filtrada, os demais results ficam ocultos.
Seção 1 - Filtro
<section id="citys">
<div class="container">
<div class="row">
<div class="col-md-3">
<form>
<div class="form-group">
<label for="sel1">Cidade</label>
<select class="form-control" name="list_citys">
<option value="all_city">Todas</option>
<option value="city_sp">São Paulo</option>
<option value="city_barueri">Barueri (Tamboré)</option>
<option value="city_campinas">Campinas</option>
<option value="city_guaruja">Guarujá</option>
<option value="city_santos">Santos</option>
<option value="city_santo_andre">Santo Andre</option>
<option value="city_sao_campo">São Bernado do Campo</option>
<option value="city_sao_jose_campos">São José dos Campos</option>
<option value="city_ribeirao_preto">Ribeirão Preto</option>
<option value="city_outlet">Outlet</option>
</select>
<br>
</div>
</form>
</div>
</div>
</div>
</section>
SEÇÃO 2 - RESULTADO
<section class="list_citys_shop">
<div class="container">
<div class="col-md-3">
<ul class="list-citys list-unstyled" data-category="city_sp">
<li><h4 class="shop-text-h4">São Paulo - Centro</h4></li>
<li class="new-citys" >Second item</li>
<li class="new-citys">Third item</li>
</ul>
</div>
<div class="col-md-3">
<ul class="list-citys list-unstyled" data-category="city_sp">
<li><h4 class="shop-text-h4">São Paulo - Morumbi</h4></li>
<li class="new-citys" >Second item</li>
<li class="new-citys">Third item</li>
</ul>
</div>
</div>
<div class="container">
<div class="col-md-3">
<ul class="list-citys list-unstyled" data-category="city_barueri">
<li><h4 class="shop-text-h4">Barueri - Centro</h4></li>
<li class="new-citys" >Second item</li>
<li class="new-citys">Third item</li>
</ul>
</div>
<div class="col-md-3">
<ul class="list-citys list-unstyled" data-category="city_barueri">
<li><h4 class="shop-text-h4">Barueri - Tropical</h4></li>
<li class="new-citys" >Second item</li>
<li class="new-citys">Third item</li>
</ul>
</div>
</div>
</section>
JavaScript
<script type="text/javascript">
$('select#list_citys').change(function() {
var filter = $(this).val()
filterList(filter);
});
function filterList(value) {
var list = $(".list_citys_shop .new-citys");
$(list).fadeOut("fast");
if (value == "all_city") {
$(".list-citys").find("ul").each(function (i) {
$(this).delay(200).slideDown("fast");
});
} else {
$(".list_citys_shop").find("ul[data-category*=" + value + "]").each(function (i) {
$(this).delay(200).slideDown("fast");
});
}
}
</script>
name
. Devia ser$('select[name="list_citys"]')
---> jsfiddle.net/r3f9t9jo – Sergio♦ 28/04/17 às 19:05