Tengo una funcion para buscar elementos en una tabla:
export const buscador = (este,columna) => {
var tableReg = $(este).parent("td").parent("tr").parent("thead").parent("table")[0];
var searchText =$(este).val().toLowerCase();
var cellsOfRow="";
var found=false;
var compareWith="";
for (var i = 1; i < tableReg.rows.length; i++)
{
cellsOfRow = tableReg.rows[i].getElementsByTagName('td');
found = false;
compareWith = cellsOfRow[columna].innerHTML.toLowerCase();
if(compareWith[0]!='<'){
if (searchText.length == 0 || (compareWith.indexOf(searchText) > -1))
{
found = true;
}
}
if(found)
{
tableReg.rows[i].style.display = '';
} else {
tableReg.rows[i].style.display = 'none';
}
}
}
al cual llamaba mas o menos asi en javascript-html:
<input placeholder="Buscar" onkeyup="buscador(this,0)" type="text" class="form-control" >
Y como entenderán this
me enviaba al input
y a partir de ahí hacia la búsqueda, pero ahora hago algo similar en react pero no me funciona:
<input placeholder="Buscar" onChange={()=>buscador(this,0)} type="text" className="form-control"/>
pero en este caso this
ya no es el input
que yo esperaba, la verdad no se que es lo que llega(ya lo vi en consola no se que seria.), pero lo que quisiera conseguir es enviar el input en esa variable.¿Como lo logro?
onChange={buscador}
this
es el elemento del DOM mientras que en React es el componente