Listen to keydown event of a text field using Prototype? - prototypejs

I want to listen to keydown events of a text field (input type=text) using Prototype. I managed to listen to the keydown event globally like this:
document.observe('keydown', myEventHandler);
function myEventHandler(evt) {
alert(evt);
}
How can I listen to events only for my text fiekd with id "test" for example?
Thanks!

Event.observe('test','keydown',myEventHandler);
function myEventHandler(event) {
alert(event);
}

Related

How to listen to variable event in Meteor Template event?

The question basically is how to convert this:
var evt = 'click' || 'touchstart'; // Based on some logic
$('.selector').on(evt, function(){});
into Meteor event handler
Template.MyTemp.events({
....??? : function(e, t){}
});
UPDATE
Based on the comments below, seems like chrome is the problem, as it sets the touch events passive = true.
So the new question would be:
How to set the passive property for event listeners in Blaze Template
Events?
You can specify multiple events in a single handler by using a / as a delimiter between the event types. docs
Template.MyTemp.events({
'click/touchstart .selector'(e,t){
e.preventDefault(); // prevents default click after touchstart
// your handler
}
});
In english:
for the template MyTemp handle click or touchstart events on the
selector class.
This is also useful reading: touch and mouse

How to code input validation on focusout in Meteor JS?

How to validate input fields on focusout before going for the next input field in Meteor JS? Like in AngularJS.
Attach an event handler to the field's change event, for example:
Template.myTemplate.events({
'change #myField'(event) {
// do your validation here
}
});
You can use the focusout on the events like this
Template.templateName.events({
'focusout #inputId' (event, instance) {
// insert code in here :D
}
});

How do you stop listening to a socket.io channel?

In socket.io, you can bind to a socket event/channel like this:
<script src="/socket.io/socket.io.js"></script>
<script>
var socket = io.connect('http://localhost');
socket.on('news', function (data) {
console.log(data);
socket.emit('my other event', { my: 'data' });
});
</script>
But how do you stop listening to the "news" event?
Try, socket.removeAllListeners("news");
The off function can also be used.
socket.off('news'); // stops listening to the "news" event
socket.off('news', myFunction); // useful if you have multiple listeners for the same event
socket.off(); // stops listening to all events
Sources
According to the Socket.io Client Documentation "the socket actually inherits every method of the Emitter class, like hasListeners, once or off (to remove an event listener)."
Emitter documentation:
Pass event and fn to remove a listener.
Pass event to remove all listeners on that event.
Pass nothing to remove all listeners on all events.
If you want to remove only a specific event you can try socket.removeListener('you_event');

Kendo Grid onchange event

How to prevent the Kendo MVC Grid Buttons event.Like
Save button , Cancel button.
I am working on ASP.NET MVC4 application with Kendo MVC controls.
I want to do that on onchange event of Kendo Grid.Below is my code for onchange function calling:
.Events(events => events.Change("onChange"))
And in which i want to prevent the Save and Cancel button events in case of firing any validation on onchange event.
Below is the code of my onchange event:
function onChange(arg) {
$(".k-button.k-button-icontext.k-grid-add").html("<span class=\"k-icon k-add\"></span>Add New Media");
if (!arg.action) {
$(".k-button.k-button-icontext.k-grid-save-changes").hide();
$(".k-button.k-button-icontext.k-grid-cancel-changes").hide();
$("#gridkendo").show();
} else {
if (arg.items[0].Name) {
}
}
}
I want to prevent the Kendo grid's buttons on onchange event function else condition.
FYI,i am using argument in onchange event function argument.
On the first line of your onChange function use preventDefault on the event.
function onChange(arg) {
arg.stopImmediatePropagation();
// rest of your code
}
Have a look at the documentation https://api.jquery.com/event.stopimmediatepropagation/
The work that usually happens on a grid change event, will not.

how to remove the click event using jquery

I have a jquery code to set the click event as follow:
$("#somediv").click(function() {alert('test')});
How do I remove the above click event? it seems that the .click() method will always append the exisiting ones.
Use
$('#somediv').unbind('click');
If you only want to remove that function, you need a reference to it:
var test = function() {alert('test');};
$("#somediv").click(test);
window.setTimeout(function () {
$('#somediv').unbind('click', test);
}, 10000);
http://api.jquery.com/unbind/
You can use off() method as well.
on() will be used to create event and off() will be used to remove event.
function clickEvent() {
$("#somediv2").show().fadeOut("slow");
};
To **remove** events you can use like this,
$('#somediv').off("click", "#somediv1", clickEvent);
To **add** events you can use like this,
$('#somediv').on("click", "#somediv1", clickEvent);
http://api.jquery.com/off/
http://api.jquery.com/on/

Resources