0

Tengo el siguiente codigo en JQuery, una funcion para filtrar un array que almaceno en una variable global,se trata de un JSON que pido por AJAX.

function filtrar(dato){
       var filtrado = content.filter(function (a) {
                return a.nombre == dato;
            });
       if (filtrado.length>0) {
        
      
        $("#resultado").empty(); 
            for (var i = 0; i < filtrado.length; i++) {
          
                var newRow =
                    "<tr>" +
                    "<td>" + filtrado[i].idproducto + "</td>" +
                    "<td>" + filtrado[i].nombre + "</td>" +
                    "<td>" + filtrado[i].marca + "</td>" +
                    "<td>" + filtrado[i].categoria + "</td>" +
                    "<td>" + filtrado[i].precio + "</td>" +
                    "</tr>";
                  
                $(newRow).appendTo("#resultado");                 
       }

} 
	
  
};

Funciona perfecto, pero filtra, osea borra toda la tabla y muestra los que coinciden estrictamente, osea todo el nombre de producto en este caso. Como puedo filtrar caracter por caracter si el nombre contiene parte de la cadena buscada?

var content;
$(document).ready(function() {
listar();
var nombreBusqueda;

 $("#nombre").keyup(function() {
            
        nombreBusqueda=$("#nombre").val();
        filtrar(nombreBusqueda);
    }
);
});

Ahi arriba el codigo cuando cargo la pagina y tecleo una busqueda. Quiero buscar en el array y no en el DOM porque pienso paginar a futuro y quiero buscar sobre el total de registros

2 respuestas 2

0

Para compara cadenas y asegurarte de que un texto esta incluido dentro otro puedes utilizar el metodo indexOf este devuelve la posición desde se encuentra la palabra, sino returna -1

"Blue Whale".indexOf("Blue")    // returns 0
"Blue Whale".indexOf("Blute")   // returns -1
"Blue Whale".indexOf("Whale",0) // returns 5
"Blue Whale".indexOf("Whale",5) // returns 5
"Blue Whale".indexOf("",9)      // returns 9
"Blue Whale".indexOf("",10)     // returns 10
"Blue Whale".indexOf("",11)     // returns 10

El método indexOf es sensible a mayúsculas. Por ejemplo, la siguiente expresión devuelve -1:

"Ballena Azul".indexOf("azul")

Para resolverte eso puedes pasar todo a minuscula o mayuscula durante la busqueda,

$textoCompleto = "Ballena Azul"; 
$textoABuscar = "aZUl";
$textoCompleto.toLowerCase().indexOf($textoABuscar.toLowerCase()); //returns 8
1
  • Claro, entonces tendria que recorrer el array inicial y poner un condicional si es distinto de -1. Pero tendria que recorrer solo la columna nombre, ya que el JSON tiene el id y el precio entre otros.
    – Caruso
    el 3 jul. 2018 a las 12:02
0

simplemente itere sobre el nombre dentro del array utilizando IndexOf como la planteo Samir Llorente.

function filtrar(dato){
        var filtrado=[];
        var existe;
    for(var i = 0; i < content.length; i++) {
    if (content[i].nombre.toLowerCase().indexOf(dato.toLowerCase())!=-1) {
        filtrado.push(content[i]);
          console.log("se encuentra objeto!.");
       
    }
}
     if (filtrado.length>0) {
        
      $("#resultado").empty();
        
            for (var i = 0; i < filtrado.length; i++) {
          
                var newRow =
                    "<tr>" +
                    "<td>" + filtrado[i].idproducto + "</td>" +
                    "<td>" + filtrado[i].nombre + "</td>" +
                    "<td>" + filtrado[i].marca + "</td>" +
                    "<td>" + filtrado[i].categoria + "</td>" +
                    "<td>" + filtrado[i].precio + "</td>" +
                    "</tr>";
                  
                $(newRow).appendTo("#resultado");                 
       }
 
	
  
}};

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.