• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 2180
  • Last Modified:

auto submit after x characters

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>
0
waygood
Asked:
waygood
  • 7
  • 5
  • 4
  • +1
2 Solutions
 
waygoodAuthor 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.
0
 
BustaroomsCommented:
im not sure how or if this will work once you hook up a card reader but this little snippet will submit the form after the user presses more than 5 keys on a normal keyboard

<input type="password" name="passcode" onkeyup="if(count >5) this.form.submit(); else count++;" />
0
 
waygoodAuthor 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.
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
ZvonkoSystems architectCommented:
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.

0
 
ZvonkoSystems architectCommented:
Some small improvment:


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


0
 
BustaroomsCommented:
duh, what was i thinking witha counter   length is so much better
0
 
ZvonkoSystems architectCommented:
Bustarooms, did you test your proposal?
0
 
BustaroomsCommented:
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
0
 
GwynforWebCommented:
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>
0
 
ZvonkoSystems architectCommented:
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

0
 
BustaroomsCommented:
thanks Zv, it would need to be declared somewhere else in the document.
0
 
ZvonkoSystems architectCommented:
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.
0
 
waygoodAuthor 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.
0
 
ZvonkoSystems architectCommented:
Splitting points to experts who helped is always a good idea :)
0
 
ZvonkoSystems architectCommented:
Thanks.
0
 
waygoodAuthor Commented:
thank you all for your speedy replies.

See you soon
Matt
0
 
GwynforWebCommented:
"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
0
 
waygoodAuthor 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.
0

Featured Post

Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

  • 7
  • 5
  • 4
  • +1
Tackle projects and never again get stuck behind a technical roadblock.
Join Now