Después de tener algunas pequeñas victorias con JS (todavía un gran aprendiz), ahora he heredado una tarea que es cambiar una especie de búsqueda reductiva.

Los usuarios ahora quieren que la búsqueda funcione desde un botón de envío, en lugar de una tecla después del tercer carácter. He completado formularios de envío antes donde se publicaría el formulario, pero nunca antes me había encontrado con algo tan complejo como esto.

Eché un vistazo al gran archivo JS y localicé la función de búsqueda que contiene la función keyup.

 F.initSearch = function(opts){ if(!opts || !opts.ele){ return; } if(!opts.start_length){ this.opts.search.start_length = 2 } this.$search_ele = $(this.opts.search.ele); if(this.$search_ele.length){ this.has_search = true; this.searchFn = this.buildSearchFn(opts.fields); this.bindEvent(opts.ele, 'keyup'); } };

Sin embargo, tengo dificultades para cambiar de pulsación de tecla a clic de botón.

Esto es lo que he hecho:

He actualizado el formulario para incluir el botón

 <form> <div class="searchBox"> <input type="text" id="search" class="search__text-input" placeholder="Search"/> </div> <div class="formBox"> <button id="searchbtn">Search</button> </div> </form>

He intentado actualizar el script con algo de jquery que sigue el mismo patrón.

 $( "#searchbtn" ).this.bindEvent(opts.ele, 'click');

Por último, intenté actualizar el existente, que ahora me está dejando algo derrotado:

 F.initSearch = function(opts) { if(!opts || !opts.ele) { return; } if(!opts.start_length) { this.opts.search.start_length = 2 } this.$search_ele = $(this.opts.search.ele); if(this.$search_ele.length) { this.has_search = true; this.searchFn = this.buildSearchFn(opts.fields); // this.bindEvent(opts.ele, 'keyup'); /* Trying to swap keyup for button click */ $( "#searchbtn" ).this.bindEvent(opts.ele, 'click'); } };

Enlace a JSFiddle: https://jsfiddle.net/mcmaca002/bo0y3u7p/2/

Claramente me estoy acercando a esto mal, y alguna orientación sería muy apreciada.