Using barcode input data to textbox and move to second textbox the focus

newphpcoder · 05-02-2012, 03:45 AM

Hi..

I have form and i want to input data using barcode and it will display on textbox and after input on the first textbox the focus will go to next textbox untill it will go on the last textbox and on the last textbox it will automatically save the data's on the database.

How is it possible?

here is my sample code:

Code:

<?php
    error_reporting(0);
   date_default_timezone_set("Asia/Singapore"); //set the time zone  
$con = mysql_connect('localhost', 'root','');

if (!$con) {
    echo 'failed';
    die();
}
mysql_select_db("mes", $con);
?>

<html>
<head>
<script type="text/javascript">
function ini()
{

// Retrieve the code
var code =document.getElementById ("code_read_box1").value;
var code =document.getElementById ("code_read_box2").value;
var code =document.getElementById ("code_read_box3").value;
var code =document.getElementById ("code_read_box4").value;
var code =document.getElementById ("code_read_box5").value;
var code =document.getElementById ("code_read_box6").value;
// Return false to prevent the form to submit
return false;

}

</script>
</head>
<body onLoad="document.barcode.code_read_box1.focus()">

<form name=barcode onsubmit = "return ini()">

<input type="text" id="code_read_box1" value="" /><br/>
<input type="text" id="code_read_box2" value="" /><br/>
<input type="text" id="code_read_box3" value="" /><br/>
<input type="text" id="code_read_box4" value="" /><br/>
<input type="text" id="code_read_box5" value="" /><br/>
<input type="text" id="code_read_box6" value="" /><br/>
</form>

</body>
</html>

Philip M · 05-02-2012, 07:59 AM

It makes no sense to assign the same variable name code to several different HTML elements.

Use onblur() on your final textbox to call some function and submit the form.

All advice is supplied packaged by intellectual weight, and not by volume. Contents may settle slightly in transit.

newphpcoder · 05-02-2012, 08:04 AM

Quote:

Originally Posted by Philip M

It makes no sense to assign the same variable name code to several different HTML elements.

Use onblur() on your final textbox to call some function and submit the form.

All advice is supplied packaged by intellectual weight, and not by volume. Contents may settle slightly in transit.

I tried this:

Code:

<?php
    error_reporting(0);
   date_default_timezone_set("Asia/Singapore"); //set the time zone  
$con = mysql_connect('localhost', 'root','');

if (!$con) {
    echo 'failed';
    die();
}
mysql_select_db("mes", $con);
?>

<html>
<head>
<script type="text/javascript">
function ini()
{

// Retrieve the code
/*var code =document.getElementById ("code_read_box1").value;
var code =document.getElementById ("code_read_box2").value;
var code =document.getElementById ("code_read_box3").value;
var code =document.getElementById ("code_read_box4").value;
var code =document.getElementById ("code_read_box5").value;
var code =document.getElementById ("code_read_box6").value;
// Return false to prevent the form to submit
return false;*/

                if (!document.getElementById('code_read_box1').disabled){
                    document.getElementById('code_read_box1').disabled = true;
                }
                if (!document.getElementById('code_read_box2').disabled) {
                    document.getElementById('code_read_box2').disabled = true;
                }
                if (!document.getElementById('code_read_box3').disabled) {
                    document.getElementById('code_read_box3').disabled = true;
                }
                if (!document.getElementById('code_read_box4').disabled) {
                    document.getElementById('code_read_box4').disabled = true;
                }
                if (!document.getElementById('code_read_box5').disabled) {
                    document.getElementById('code_read_box5').disabled = true;
                }
                if (!document.getElementById('code_read_box6').disabled) {
                    document.getElementById('code_read_box6').disabled = true;
                }
}

</script>
</head>
<body onLoad="document.barcode.code_read_box1.focus()">

<form name=barcode onblur = "return ini()">

<input type="text" id="code_read_box1" value="" onblur="this.focus();" onkeypress="return false"/><br/>
<input type="text" id="code_read_box2" value="" onblur="this.focus();" onkeypress="return false"/><br/>
<input type="text" id="code_read_box3" value="" onblur="this.focus();" onkeypress="return false"/><br/>
<input type="text" id="code_read_box4" value="" onblur="this.focus();" onkeypress="return false"/><br/>
<input type="text" id="code_read_box5" value="" onblur="this.focus();" onkeypress="return false"/><br/>
<input type="text" id="code_read_box6" value="" onblur="this.focus();" onkeypress="return false"/><br/>
</form>

</body>
</html>

Yet after I have data on the first textbox, it did not move the focus on the next textbox

Thank you

Philip M · 05-02-2012, 08:12 AM

onblur="this.focus();"

What do you expect?

newphpcoder · 05-02-2012, 08:15 AM

Quote:

Originally Posted by Philip M

onblur="this.focus();"

What do you expect?

It will focus on that textbox if the above textbox has data

I'm sorry.. .I really don't know what the correct syntax

Thank you

codebarcode · 01-29-2013, 02:17 AM

Quote:

Originally Posted by newphpcoder

Hi..

I have form and i want to input data using barcode and it will display on textbox and after input on the first textbox the focus will go to next textbox untill it will go on the last textbox and on the last textbox it will automatically save the data's on the database.

How is it possible?

here is my sample code:

Code:

<?php
    error_reporting(0);
   date_default_timezone_set("Asia/Singapore"); //set the time zone  
$con = mysql_connect('localhost', 'root','');

if (!$con) {
    echo 'failed';
    die();
}
mysql_select_db("mes", $con);
?>

<html>
<head>
<script type="text/javascript">
function ini()
{

// Retrieve the code
var code =document.getElementById ("code_read_box1").value;
var code =document.getElementById ("code_read_box2").value;
var code =document.getElementById ("code_read_box3").value;
var code =document.getElementById ("code_read_box4").value;
var code =document.getElementById ("code_read_box5").value;
var code =document.getElementById ("code_read_box6").value;
// Return false to prevent the form to submit
return false;

}

</script>
</head>
<body onLoad="document.barcode.code_read_box1.focus()">

<form name=barcode onsubmit = "return ini()">

<input type="text" id="code_read_box1" value="" /><br/>
<input type="text" id="code_read_box2" value="" /><br/>
<input type="text" id="code_read_box3" value="" /><br/>
<input type="text" id="code_read_box4" value="" /><br/>
<input type="text" id="code_read_box5" value="" /><br/>
<input type="text" id="code_read_box6" value="" /><br/>
</form>

</body>
</html>

Actually I tried the winforms bar code project before in VS to encode barcode in the textbox, after I click the button, it will generate the target data to a barcode like QR Code or something, what you need to add is the click event.