We help IT Professionals succeed at work.

Check out our new AWS podcast with Certified Expert, Phil Phillips! Listen to "How to Execute a Seamless AWS Migration" on EE or on your favorite podcast platform. Listen Now

x

auto submit after x characters

waygood
waygood asked
on
Medium Priority
2,214 Views
Last Modified: 2013-12-03
Hello experts,

I am new to this section, but I have created a basic clocking-in machine using PHP. I have everything setup perfectly but now I want to extend it a little to make it more realistic.
I currently have a form with 1 input text which is auto-selected. The user enters their code and presses enter, which is great.

I am waiting to purchase a card reader (magnetic swipe) and I am looking to get the user to swipe a card and have the form submit automatically once the card has been swiped. IE if the number of characters reaches a certain length. I dont know what format of cards will be used yet, so a solution checking for the first x characters would be sufficient. Any suggestions??

the page in question is below

<html>
      <head>
            <title>Armour Group - TimeClock system...</title>
            <meta http-equiv="Expires" content="Mon, 01 Jan 1996 23:59:59 GMT" />
            <meta http-equiv="Pragma" content="no-cache">
<SCRIPT LANGUAGE="JavaScript">
<!-- Original:  Xavier R. (xav@lougaou.com) -->
<!-- Modified:  Benjamin Wright, Editor -->
<!-- Web Site:  http://www.lougaou.com/ -->

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->

<!-- Begin
function clock() {
if (!document.layers && !document.all) return;
var digital = new Date();
var hours = digital.getHours();
var minutes = digital.getMinutes();
var seconds = digital.getSeconds();
var amOrPm = "AM";
if (hours > 11) amOrPm = "PM";
if (hours > 12) hours = hours - 12;
if (hours == 0) hours = 12;
if (minutes <= 9) minutes = "0" + minutes;
if (seconds <= 9) seconds = "0" + seconds;
dispTime = hours + ":" + minutes + ":" + seconds + " " + amOrPm;
if (document.layers) {
document.layers.pendule.document.write(dispTime);
document.layers.pendule.document.close();
}
else
if (document.all)
pendule.innerHTML = dispTime;
setTimeout("clock()", 1000);
}
//  End -->

function FormSetFocus()
{
  if (document.forms.length > 0)
  {
    var TForm = document.forms[0];

    for (i=0;i<TForm.length;i++)
    {
      if ((TForm.elements[i].type=="text")||
       (TForm.elements[i].type=="textarea")||
         (TForm.elements[i].type=="password")||
       (TForm.elements[i].type.toString().charAt(0)=="s"))
      {
        document.forms[0].elements[i].focus();
        break;
      }
    }
  }
}

</script>

      </head>            
      <body onLoad="clock()">
            <center>
                  <h2>TimeClock System</h2>
                  <br/>
                  <br/>
                  <br/>
                  <span id="pendule" style="background: #000000; color: #80c0c0; font-weight: bold; font-size: 40px; Padding: 20px; border: 20px #ffffff"></span>
                  <br/>
                  <br/>
                  <br/>
                  Please enter your passcode
                  <br/>
                  <br/>
                  <form name="log" method="post" action="proc_log.php">
                        <input type="password" name="passcode" />
                        <br/>
                        <br/>
                        <input type="submit" value="CLOCK" />
                  </form>
            </center>
            <script language="javascript" type="text/javascript">
                  FormSetFocus();
            </script>
      </body>
</html>
Comment
Watch Question

Author

Commented:
The card swipe will be connected to the keyboards ps2 connection as an extension. So basically it emulates using the keyboard.

We cant stretch to buying expensive cards and equipment, so I'll probably use some free store loyalty cards with labels on the front. So I dont know the format of the data as yet, and cant change it, as we will only have a reader.
Unlock this solution and get a sample of our free trial.
(No credit card required)
UNLOCK SOLUTION

Author

Commented:
p.s. Its only running on one machine using IE5+, I wouldnt like to install any third party software to check the keyboard buffer as the pc may also be used for other things.
ZvonkoSystems architect
CERTIFIED EXPERT
Top Expert 2006

Commented:
Like this:

<input type="password" name="passcode" onKeyUp="if(this.value.length==4)this.form.submit()"/>

I set the character count to four. Set greater count if needed.

Systems architect
CERTIFIED EXPERT
Top Expert 2006
Commented:
Unlock this solution and get a sample of our free trial.
(No credit card required)
UNLOCK SOLUTION
duh, what was i thinking witha counter   length is so much better
ZvonkoSystems architect
CERTIFIED EXPERT
Top Expert 2006

Commented:
Bustarooms, did you test your proposal?
no, does it now work?  it doesn't matter either way, like i said, using the length is much better

waygood go with Zvonko's
this works nicely

<form name="log" method="post" action="proc_log.php">
<input type="password" name="passcode"   onKeyUp="if(this.value.length==4) this.form.submit()" />
</form>
ZvonkoSystems architect
CERTIFIED EXPERT
Top Expert 2006

Commented:
I mean only for the future readers is better to mention the pittfal in your code:
Because the "count" var was not declared before if condition checking will the statement fail at that position.
Error will be:
"count" is undefined

thanks Zv, it would need to be declared somewhere else in the document.
ZvonkoSystems architect
CERTIFIED EXPERT
Top Expert 2006

Commented:
Besid that the check for length "four" is a copy of my code it has the same problem as my previous code had (not my last example, it works).
If you check for equal, then you miss character repetition by holding down a key and the submit() will NOT fire.

Author

Commented:
dont know if this is an issue using the swipe but I'll post another question if things dont work out.

I had a problem getting the page to work as i saved a copy off to index2.php THEN remembered I was redirecting back to index.php afterwards. Duh!

Nice job guys, I'll go with Zvonko, but try to give some points to Bustarooms too.
ZvonkoSystems architect
CERTIFIED EXPERT
Top Expert 2006

Commented:
Splitting points to experts who helped is always a good idea :)
ZvonkoSystems architect
CERTIFIED EXPERT
Top Expert 2006

Commented:
Thanks.

Author

Commented:
thank you all for your speedy replies.

See you soon
Matt
"Besid that the check for length "four" is a copy of my code it ..."

Zvonko I am shocked that you should make such an accusation

Author

Commented:
why is it shocking?
if Zvonko posted an answer and then you posted the exact same answer, you either didnt read it, was typing for over 15mins while the other message was being added or you did it deliberately. Either way I gave points to the first person to post an answer that worked, I also gave points for changing the answer slightly as the first method was a little flawed but still worked.
Unlock the solution to this question.
Thanks for using Experts Exchange.

Please provide your email to receive a sample view!

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.