带有2个(隐藏)提交按钮和1个其他隐藏输入的HTML表单

时间:2013-06-10 21:42:32

标签: php javascript html submit hidden

我正在尝试构建在Android平板电脑上运行的应用程序,并附带条形码扫描仪。 条形码扫描程序在每次扫描的代码后发送回车。

我需要扫描2个条形码并提交表格。

我创建了一个带有两组输入+提交按钮的表单,第二个隐藏了一个。扫描完第一个条形码并且scnner发送Enter键后,隐藏的元素显示出来,我可以扫描第二个条形码。但是,第二次Enter键不起作用。它只有按下按钮才能工作(在我取消隐藏后)。 如何处理这个问题,以便不需要用户输入(扫描条形码除外)?

到目前为止,这是我的代码:

    <form action="barcode.php" method="post" class="pure-form" style="width:100%">
        <fieldset>
            <legend>Scaneaza o fisa noua de <?php echo $operation; ?>:</legend>
            <input type="text" name="barcode" autofocus id="InputID" placeholder="Codul de bare" style="width:100%;font-size:2em">
            <button style="width:0;visibility:hidden;" type="submit" onclick="show_popup('my_popup'); return false;"></button>
                <div id="my_popup" style="display:none;border:3px dotted gray;padding:.3em;background-color:white;position:absolute;width:80%;height:20%;margin:-50px 50px 0 50px;">
                    <legend>Introdu numarul de KO-uri:</legend>
                    <input type="text" name="kos" autofocus id="InputID" placeholder="KO-uri" style="width:100%;font-size:2em">
                    <button type="submit" class="pure-button pure-button-primary" style="/*width:0;visibility:hidden;*/" onclick="hide_popup('my_popup'); return true;">Trimite</button>
                </div>
        </fieldset>
    </form>

    <script type="text/javascript">
        function FocusOnInput() { document.getElementById("InputID").focus(); }
        function show_popup(id) {
            if (document.getElementById){
                obj = document.getElementById(id);
                if (obj.style.display == "none") {
                    obj.style.display = "";
                }
            }
        }
        function hide_popup(id){
            if (document.getElementById){
                obj = document.getElementById(id);
                if (obj.style.display == ""){
                    obj.style.display = "none";
                }
            }
        }
    </script>

和barcode.php文件:

    <?php
    ob_start();
    mysql_connect ("localhost","root","root") or die (mysql_error());
    mysql_select_db ("eficacitate");
    $barcode = $_POST["barcode"];
    $kos    = $_POST["kos"];
    $marca    = $_COOKIE["marca"];
    $operation = $_COOKIE["operation"];

    if (substr($barcode,0,1)=="^") {

    $j_nou =    substr($barcode,1,strpos($barcode, "|")-1);

    $parts = explode('|',$barcode);

    $of_nou = $parts[1];
    $cantitate_nou = $parts[2];
    $serie_nou = $parts[3];
    $adauga="INSERT INTO master (marca, operation,j,of,cantitate,serie,kos)
    VALUES
    ('$marca','$operation','$j_nou','$of_nou','$cantitate_nou','$serie_nou','$kos')";

    mysql_query($adauga);

    }

    header('Location: /eficacitate/scan.php');
    ob_flush();
    ?>

1 个答案:

答案 0 :(得分:1)

请试一试:

<form action="barcode.php" method="post" class="pure-form" style="width:100%">
<fieldset>
    <legend>Scaneaza o fisa noua de <?php echo $operation; ?>:</legend>
    <input type="text" name="barcode" autofocus id="InputID" placeholder="Codul de bare" style="width:100%;font-size:2em">
    <button id='barcodeButton' style="width:0;visibility:hidden;" type="submit" onclick="show_popup('my_popup'); return false;"></button>
    <div id="my_popup" style="display:none;border:3px dotted gray;padding:.3em;background-color:white;position:absolute;width:80%;height:20%;margin:-50px 50px 0 50px;">
        <legend>Introdu numarul de KO-uri:</legend>
        <input type="text" name="kos" autofocus id="InputID" placeholder="KO-uri" style="width:100%;font-size:2em">
        <button id='kosButton' type="submit" class="pure-button pure-button-primary" style="/*width:0;visibility:hidden;*/" onclick="hide_popup('my_popup'); return true;">Trimite</button>
    </div>

<script type="text/javascript">
    function FocusOnInput() { document.getElementById("InputID").focus(); }
    document.onkeydown = function(event) {
        if (event.keyCode == '13') { 
            barcodeButton = document.getElementById('barcodeButton');
            kosButton = document.getElementById('kosButton');

            if (document.getElementById('my_popup').style.display == 'none') {
                barcodeButton.click();
                show_popup('my_popup');
            } else {
                kosButton.click();
                hide_popup('my_popup');
            }
        }
    }

    function show_popup(id) {
        if (document.getElementById){
            obj = document.getElementById(id);
            if (obj.style.display == "none") {
                obj.style.display = "";
            }
        }
    }

    function hide_popup(id){
        if (document.getElementById){
            obj = document.getElementById(id);
            if (obj.style.display == ""){
                obj.style.display = "none";
            }
        }
    }

如果这解决了你想要实现的目标,请告诉我。出于好奇,你为什么不在这里使用jQuery?