Topic: Javascript for detecting user input on field

Hello everyone,

I'm really a noob with javascript, and need some help to start, if someone want to help me here's what I need.

I've made all the validations with RoR, but I still need to detect if 2 fields had been inputed by the user...

Looking around I found this

:onkeypress => ''

So you can call a JS function, did I get it right?

Does anyone know any place that I can learn JS sintax to declare the name of the function ad test the value of the fields?

I won't ask for code for what I need, cause I want to learn it.

Thanks in advance and happy coding.

Re: Javascript for detecting user input on field

Is the form also going to be submitted using AJAX?

You probably don't want onkeypress. That would call the function when a key is pressed. More likely what you want is to make sure that a) the user has put at least something in the field before pressing the submit button, or b) that what the user has input in the field has the correct formatting (like email or date, for example).

In the case of a), you probably don't want to check anything until the user tries to submit the form. In that case you would want to bind the click even of the submit button to a function which first checks to make sure any required fields are filled in, and if they are submits, but if not, inserts some little red error messages (or some such).

In the case of b), you probably want to bind a function to the leave fucus event (not sure what this event is actually called, but look it up). That way when the user has finished entering something into the field and is about to move on, it runs the function (which you have to write using regular expressions, most likely) and checks that the formatting is right - if it's not, the function will have to insert the little error messages wherever appropriate.

There are some helpers for automating javascript validations based off of the validations specified in your rails models, so that is something to look into. If whatever you find there won't work for you, you should also look into using jQuery or some other library to ease your way into the javascript. That's the route that I usually take with this sort of thing.

Cheers, and good luck.

Re: Javascript for detecting user input on field

Maybe the focus event would be better!

But I think the onFocusOut is perfect (found this event after reading your reply).

Still I'm gonna try either OnFocusOut and onKeyPress.

Cause there is some helpfull things I can do reading what they are trying to input.

Thanks for your tip. It helped a lot!

Re: Javascript for detecting user input on field

Great. Sounds like you're on you way.

One thing you may want to consider is binding the onKeyPress event within the function you bind to an onFocus event, that way your validations are only gonna be happening while they are typing in a specific box.

Re: Javascript for detecting user input on field

Ok, I need some advice...

I've tried this onFocusOut but as I found in a lot of examples, ppl prefer to use "onBlur" event on blur is when an element loose focus but there's one thing:

I'm trying to use it to calculate something and actualy I want the user to see it before submiting the form.

So I need to test 2 fields to calculate them and show this information to the user.
So if a user finishes inputing information on the second field and directly goes to the submit button, the event triggers and things are calculated BUT the button is clicked saving the information and the user can't see the result.

Does anyone has any idea of the best way to do this kind of feature?

Thanks in advance

Re: Javascript for detecting user input on field

Well, you could do a number of things here. One is that you could create some variable flag that use to check whether or not the calculation has happened or not yet. Then you bind to the click event of the button and first check the flag to determine whether to submit the form, or do something else instead (perhaps doing the calc, displaying the results, and then inserting a message somewhere that says "click again to submit form"). Make sense?

Re: Javascript for detecting user input on field


It makes some sense, but maybe it's better to change the "label" of the submit button to "Calculate", and use it's name as flag, if the user clicks once it won't save and redirect, but will calculate and change the "label" to "Save", then next click the name is already "Save" so it saves...


Where I live it's called POG (Programação Orientada a Gambiarras)

In english it's KOP (Kludge-Oriented Programming)

but i's what I'll need to do if I take too man time to find a way to do this...

Re: Javascript for detecting user input on field

You could also create another button just for calculatin. I think that would be less kludgey. And what if some one needed to be able to change and recalculate before submitting? This would let them do that.

Re: Javascript for detecting user input on field

You're right!

That's better! And I'm going to implement it!

Thanks! tongue