1

Olá, tudo bem? Tenho um código que filtra os dados de um JSON com jQuey, eu consigo filtrar com valores pre-definidos em uma variável. Mas queria utilizar os valores de um slide range do jquery ui para filtrar o json, só que quando tento fazer isso não consigo ele fica retornando vazio. Alguém sabe como posso utilizar o slide range para tal operação? Obrigado

Estou fazendo um filtro em JavaScript com Jquery onde ele filtra um resultado que está em Json, mas não estou consguindo fazer com que ele filtre utilizando um slider range do Jquery UI. JSON

var json = {
       "tpAmbiente":null,
       "hotelPesquisa":[
          {
             "dtEntrada":"20170510",
             "dtSaida":"20170511",
             "hotel":{
                "id":94,
                "nome":"Itamarati"
             },
             "quarto":[
                {
                   "quartoUh":[
                      {
                        "nQUarto": 1,
                         "tarifa":{
                            "vlDiariaTotal":157.21,
                            "desconto":null
                         },
                         "qtDisponivel":null,
                         "desconto":null
                      },
                      {
                        "nQUarto": 2,
                         "tarifa":{
                            "vlDiariaTotal":157.21,
                            "desconto":null
                         },
                         "qtDisponivel":null,
                         "desconto":null
                      },
                   ]
                }
             ]
          },
          {
             "dtEntrada":"20170510",
             "dtSaida":"20170511",
             "hotel":{
                "id":95,
                "nome":"copacabana"
             },
             "quarto":[
                {
                   "quartoUh":[
                      {
                        "nQUarto": 1,
                         "tarifa":{
                            "vlDiariaTotal":102.1,
                            "desconto":null
                         },
                         "qtDisponivel":null,
                         "desconto":null
                      },
                      {
                        "nQUarto": 2,
                         "tarifa":{
                            "vlDiariaTotal":102.1,
                            "desconto":null
                         },
                         "qtDisponivel":null,
                         "desconto":null
                      },
                   ]
                }
             ]
          },
          {
             "dtEntrada":"20170510",
             "dtSaida":"20170511",
             "hotel":{
                "id":96,
                "nome":"Itamarati"
             },
             "quarto":[
                {
                   "quartoUh":[
                      {
                        "nQUarto": 1,
                         "tarifa":{
                            "vlDiariaTotal":157.21,
                            "desconto":null
                         },
                         "qtDisponivel":null,
                         "desconto":null
                      },
                      {
                        "nQUarto": 2,
                         "tarifa":{
                            "vlDiariaTotal":157.21,
                            "desconto":null
                         },
                         "qtDisponivel":null,
                         "desconto":null
                      },
                   ]
                }
             ]
          },
          {
             "dtEntrada":"20170510",
             "dtSaida":"20170511",
             "hotel":{
                "id":96,
                "nome":"Litoral Hotel"
             },
             "quarto":[
                {
                   "quartoUh":[
                      {
                        "nQUarto": 1,
                         "tarifa":{
                            "vlDiariaTotal":1001.00,
                            "desconto":null
                         },
                         "qtDisponivel":null,
                         "desconto":null
                      },
                      {
                        "nQUarto": 2,
                         "tarifa":{
                            "vlDiariaTotal":1001.00,
                            "desconto":null
                         },
                         "qtDisponivel":null,
                         "desconto":null
                      },
                   ]
                }
             ]
          }
       ]
    };

Função

function filtro(min, max){
    var pesquisa = {
      min: min,
      max: max
    };
    var filtrados = json.hotelPesquisa.filter(function(hotel) {
        hotel.quarto[0].quartoUh = hotel.quarto[0].quartoUh.filter(function(quarto) {
            return quarto.tarifa.vlDiariaTotal  dados.min;
        });
        return hotel.quarto[0].quartoUh.length > 0;
    });
    console.log(filtrados);
}

Eu utilizo o Jquery UI o slider range que o código e:

$("#price-range").slider({
    range: true,
    min: 0,
    max: 1000,
    values: [ 0, 1000 ],
    slide: function( event, ui ) {
        tjq(".min-price-label").html(ui.values[ 0 ]);
        tjq(".max-price-label").html(ui.values[ 1 ]);
        filtro(ui.values[ 0 ], ui.values[ 1 ]);
    }
});

Quando eu arrasto o slider ele chama a função filtro passando os parametros min e max para poder filtrar o json com os valores minimos e maximos do slider. no começo ele ate filtra mas depois que arrasto o slider varias vezes ele retorna vazio:

[]

Alguém sabe como posso resolver isso? Obrigado!

2
  • Que tal você editar sua pergunta e adicionar o seu código? Ficará muito mais fácil entendermos o que você está querendo. Busque também fazer um Exemplo Mínimo, Completo e Verificável para que possamos verificar as soluções.
    – Woss
    12/05/2017 às 16:25
  • @AndersonCarlosWoss Espero que assim fique melhor de entender.
    – Enio
    12/05/2017 às 16:32

1 Resposta 1

2

Sempre que possível, coloque o seu código completo no JSFiddle ou outra ferramenta semelhante. Assim podemos ver o problema ocorrendo e fica mais fácil avaliar.

Fiz um exemplo com base no seu código. Se necessário, edite o código, clique em Update e me mande o link.

Os valores filtrados estão aparecendo no log do console.

Exemplo - JSFiddle.

5
  • 1
    Obrigado. O meu problema e o seguinte. Preciso que o filtro me retorne o um json com todos os hoteis onde os preços dos quartos sejam maior que 0 e menor que 1010 com valores definidos manualmente em um array ele filtra normal mas quando utilizo o slide range ele não filtra. ele começa a filtrar quando deslide o slide range mas depois começa a retornar so [] como mostra ** NESTA IMAGEAM ** o link do JSFiddle olha no console jsfiddle.net/newtech/xrkuoqhq/2
    – Enio
    12/05/2017 às 19:08
  • Percebi que no seu código, caso não haja hotel que se enquadre no filtro (ex.: Min=200 Max=900), a variável filtrados não volta a pegar os valores. Por conta da falta de experiência, não posso dizer porque isso ocorre. Contudo, veja que no meu exemplo, usando o loop for (i = 0; i < filtrados.length; i++) esse problema não ocorre. 12/05/2017 às 19:41
  • No seu exemplo tem como ele retornar o json ao invés de retornar o preço?
    – Enio
    12/05/2017 às 19:48
  • Sim. Em console.log troque valorQuarto por filtrados if (valorQuarto >= min && valorQuarto <= max) { console.log(filtrados); } 12/05/2017 às 19:54
  • Repare que ele sempre retorna 4 objetos e neles tem quartos onde o preço não enta dentro dos valores do slide: uploaddeimagens.com.br/imagens/sssssssssssssss-png--5
    – Enio
    12/05/2017 às 20:00

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .