View Full Version : Showing X or check, on textboxs

09-03-2008, 06:11 PM
I have a security code on my website, a user must type it in perfectly according to whats in the database.

I have 4 text boxes with a max length of 4 characters each. A code would look something like this and is unique.

e4HQ Dcvz 1P0d Y6Nh

I would like a red X or a green check image to appear at the end of the box if the code they entered is correct. So it would search the database when all 4 are filled in, and produce if its right or wrong.

09-03-2008, 07:12 PM
so have it make it's request to a processor page which will query against wherever you have that code stored and echo what you want depending on the results. you could echo img tags that show the check or X or even change the class of the box element.

then it's just a matter of deciding when you want that request to go out, be it a onchange on the fields, onblur when clicking something else, a submit\enter button, or even a keystroke capture or something.

09-04-2008, 12:49 AM
Hmm, this could take me weeks to figure out. I just started learning about Ajax yesterday, read 3 pages of a tutorial and am already confused.

09-04-2008, 02:21 AM
What have you tried. Show us what you have done.


09-04-2008, 02:21 PM
I haven't done any Ajax, I only have the PHP part right now.

echo '<form action="rewards.php?do=gamecard" method="post">';
echo '<input type="text" style=\'background-color:#CDBA96;\' size="4" maxlength="4" name="one" value=""> <input type="text" style=\'background-color:#CDBA96;\' size="4" maxlength="4" name="two" value=""> <input type="text" style=\'background-color:#CDBA96;\' size="4" name="three" maxlength="4" value=""> <input type="text" style=\'background-color:#CDBA96;\' size="4" name="four" maxlength="4" value=""><br><br>';
echo '<input type="submit" name="code" class="altButtonFormat" value="Process"></form>';

I don't know Ajax yet, trying to learn it slowly in my free time.

09-04-2008, 04:25 PM
it's kind of the lazy way, but if you don't have time to learn it in detail you could grab a framework that supports ajax like prototype. if you can read an api doc than you can make as advanced a function as you would ever like.



you could have it done in a few minutes... but i wouldn't expect to have any great knowledge of ajax afterwards. it really depends what your goal is. if you want to use prototype http://www.prototypejs.org/api/ajax/updater would be more or less what you're looking for. i can show you how to use it if you like.

09-04-2008, 11:11 PM
ohgod, thank you. I will check that out. Hopefully in a few months, I will know enough to do what I need done.

09-08-2008, 05:11 PM
no worries. yell if you'd like a hand.

rnd me
09-09-2008, 06:44 AM
it would be quite simpler to change the element.backgroundColor to red or green. you will have to use images to display a check, since the unicode value for it is not universally compatible with all fonts and browsers.