Solved

auto submit after x characters

Posted on 2004-03-26
18
2,157 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>
0
Comment
Question by:waygood
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 7
  • 5
  • 4
  • +1
18 Comments
 
LVL 9

Author Comment

by:waygood
ID: 10688486
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
 
LVL 10

Assisted Solution

by:Bustarooms
Bustarooms earned 75 total points
ID: 10688552
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
 
LVL 9

Author Comment

by:waygood
ID: 10688581
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
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 63

Expert Comment

by:Zvonko
ID: 10688598
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
 
LVL 63

Accepted Solution

by:
Zvonko earned 100 total points
ID: 10688626
Some small improvment:


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


0
 
LVL 10

Expert Comment

by:Bustarooms
ID: 10688629
duh, what was i thinking witha counter   length is so much better
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 10688661
Bustarooms, did you test your proposal?
0
 
LVL 10

Expert Comment

by:Bustarooms
ID: 10688674
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
 
LVL 31

Expert Comment

by:GwynforWeb
ID: 10688765
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
 
LVL 63

Expert Comment

by:Zvonko
ID: 10688773
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
 
LVL 10

Expert Comment

by:Bustarooms
ID: 10688795
thanks Zv, it would need to be declared somewhere else in the document.
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 10688805
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
 
LVL 9

Author Comment

by:waygood
ID: 10688848
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
 
LVL 63

Expert Comment

by:Zvonko
ID: 10688873
Splitting points to experts who helped is always a good idea :)
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 10688890
Thanks.
0
 
LVL 9

Author Comment

by:waygood
ID: 10688921
thank you all for your speedy replies.

See you soon
Matt
0
 
LVL 31

Expert Comment

by:GwynforWeb
ID: 10689252
"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
 
LVL 9

Author Comment

by:waygood
ID: 10697917
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

MS Dynamics Made Instantly Simpler

Make Your Microsoft Dynamics Investment Count  & Drastically Decrease Training Time by Providing Intuitive Step-By-Step WalkThru Tutorials.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Send form to asp server side 6 28
Increase counter and attr inside a while loop 15 37
arrays and buttons with user input 2 34
Put POST values into cookies. 14 35
This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Excel styles will make formatting consistent and let you apply and change formatting faster. In this tutorial, you'll learn how to use Excel's built-in styles, how to modify styles, and how to create your own. You'll also learn how to use your custo…

696 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question