Necesito tomar el valor del li
seleccionado y pasarlo al input
de búsqueda, pero solo recibo el primer elemento no importa cual seleccione
.haja
es el class
de ul
y .list
de los list
, var hola
debería tomar el elemento this
al que se le hace click no?.
Solo recibo Nueva actividad.
$(".haja").click(function(){
document.getElementById("is").value ="";
var hola = $(".list", this).html();
alert(hola);
document.getElementById("is").value = hola;
$(".haja").hide();
});
**UPDATE **
<html lang="es" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" type="text/css" href="../css/style.css">
<link rel="stylesheet" href="../css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="shortcut icon" href="../images/utilidad/favicon.ico" />
<!--Scripts-->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="../js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script type="text/javascript">
$("ul li").click(function(){
console.log($(this).html());
});
</script>
<script type="text/javascript">
function show(){
$(".haja").show();
}
</script>
<!--Fin -->
<title>Menu Administracion CB</title>
</head>
<body>
<!--El ul se crea desde buscador.js-->
<form class="form-inline my-2 my-lg-0">
<div class="buscador" id="bs1"></div>
<button class="btn btn-success my-2 my-sm-0" type="submit">Buscar</button>
</form>
<!--El ul de prueba tampoco funciona-->
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
</ul>
<!--SCRIPTS del ul si -->
<script src="../js/buscador.js"></script>
<script src="../js/app.js"></script>
</body>
</html>
El codigo que se crea el ul desde buscador.js es el siguiente
'use strict';
class Search {
constructor(obj) {
this.el = document.querySelector(obj.el);
this.list = obj.list;
this.init();
}
init() {
let input, listContainer;
this.el.innerHTML = `
<input placeholder="Buscar aqui" onclick="show();" type="search" id="is" class="input form-control mr-sm-2"/>
<ul class="is-visible list-group haja" id="searchList"></ul>
`;
input = document.querySelector('.input');
listContainer = document.querySelector('#searchList');
this.watch(input, this.list, listContainer);
}
watch(input, list, search) {
input.addEventListener('keyup', () => {
search.innerHTML = '';
let value = input.value.toLowerCase(),
listT = list.length,
existe = 0;
for (let i = 0; i < listT; i++) {
let text = list[i].toLowerCase();
if (value != '') {
existe = ~text.indexOf(value);
if (existe != 0) {
this.updateList(search, list[i]);
}
}
}
}, false);
}
updateList(el, text) {
el.innerHTML += `<li class="list">${text}</li>`;
}
}