jQuery - When input has text, do this

help
1

Hey!

I cant figure out how to solve this problem with meteors jQuerythingey, its not quite the same as regular jquery.

Template.search.events({
 'keypress .search': function (event, template){
   if( !template.$('.search').value ) {
	template.$('.results').hide();
  } else {
	template.$('.results').show();
   }	
  }
});

So basically if .search is empty. I want to hide .results
If .search has text inside it, i want to show .results

.search is a regular text input

–
I understand that “keypress” is wrong, but i have no idea what to replace it with. How do i create an active listener waiting for stuff to happen?

Like
>‘document’ : function (event){ do dis do dat }

Uhm, i dont know. Help me out dear meteor community!

2

What the problem is? You can’t hide/show? Or keypress isn’t triggered?

3

Keypress isnt triggered. However i dont think keypress is the best way to solve it. But it might work. Any ideas?

4

keydown or input events?

5

Keydown didnt work either. Im basically a beginner so i might do 50 different things wrong

6

I think you should use the “keyup” event. The “keydown” event triggers when the key is down and therefore the value of the key is submitted into the input only after the function is called.

7

but we can get it with event.currentTarget.innerText

8

Why is every one using jQ to get the values? e is already a jQ event/object so you can do just e.currentTarget.value - the .search is an input element right?

And the reason it is not working is simple :wink: jQ call does not return the string but the whole object within this making the call chainable, so you have to simply chain the call and do !template.$('.search').val(), but don’t do that, you can save some CPU time by utilizing e.

9

I dont know guys, this doesnt work :frowning:

view

<template name="search">
  <input id="search" type="text"/>
</template>

client

Template.search.events({
	'keyup #search': function (event, template){
		alert();
	}
});
10

I would do it on focus and pull the value from the search box. Have an if statement that checks what is in the value. If its blank then hide. else show search box

11

The answer is

Template.search.events({
	'keyup input#search': function (event, template){
		alert();
	}
});