How to capture a event on changing value in a text box -

2724 views
Skip to first unread message

Jayakumar Mounagurusamy

unread,
Feb 28, 2015, 3:10:26 AM2/28/15
to meteo...@googlegroups.com
Hello,

I have a html form with the below input element allowing users to enter a number. What I need to accomplish is on entering a number (number key press) i need to collect the take a value and do some calculation and display the result reactively?

What meteor event is available for me to accomplish that? how do i capture the data? so that i can do the calculation and update the DOM

            <input type="number" maxlength="2" class="text-warning cartProduct" size="2" min="0"  id="product_{{product}}" name="product_{{product}}" value="{{qty}}">

Any help or pointer would be greatly help.

Jay




--
Jayakumar Mounagurusamy

Daniel Dornhardt - Daniel Dornhardt Development

unread,
Feb 28, 2015, 5:50:20 AM2/28/15
to meteo...@googlegroups.com
Hi, I don't have the exact syntax here or anything or tried it, to be exact, but in general Meteor uses jquery for event handling, so the same events should be thrown as in any jquery app.

The meteor events syntax can be a bit confuddling, but you should be able to figure it out with a little bit of trial and error.

In general you would probably care about the change, keyup and mouseup events mainly, as to catch all kinds of interaction (even pasting via mouse etc).

Then you should be able to use a "normal" meteor template event handler - what's the problem with that?

Make sure your input exists in some meteor template, then do

Template.myTemplate.events({
    'change #myelement, keyup #myelement, mouseup #myelement': function(template, event) {
        Session.set('myVal', $(event.currentTarget).val());
    }
});

Note I: I am not sure that writing multiple event handlers, comma separated as I just did, works - I am never certain about the exact syntax - but maybe somebody can comment on that.

If you have dynamic input fields with dynamic #id's I recommend either a click handler on something more general, like a common .class, or on a dom element above the items in the dom hierarchy. Then of course you have to see which variable to update, depending on which field was posting the event, but that's more or less plain javascript, dom and jquery and isn't related to meteor per se.

Best wishes

Daniel

PS: Did you see forums.meteor.com too? :)

Daniel Dornhardt, Daniel Dornhardt Development
+49 152 - 56 17 22 61

--
You received this message because you are subscribed to the Google Groups "meteor-talk" group.
To unsubscribe from this group and stop receiving emails from it, send an email to meteor-talk...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/meteor-talk/CAE96ZXj%2B07kO4c8gzhtNFZ_LzMoxCNBBB%3De9OWaCQ3%3DGv1HJJA%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.

Reply all
Reply to author
Forward
0 new messages