如何在条形码扫描仪提交表单后打开引导模式框

时间:2016-12-26 11:42:01

标签: php jquery bootstrap-modal barcode-scanner purchase-order

我有一个用于条形码扫描的小表格。我扫描产品的条形码,然后会出现一个引导盒。进入模态我发布产品的条形码数量。在模态中还有另一种形式,它将检索产品的条形码编号,并填充一些输入并将其插入到mysql数据库表中。

<form name="barkod_oku" id="barkod_oku" action="" method="post" >
<input name="sto_barkod" id="sto_barkod" value="" autofocus placeholder="Barkod Numarası">
<input type="hidden" name="alis_fatura_no" value="<?php echo $finalcode1 ;?>">

</form>

这是我将2个值发布到模态框中的形式。

这是我想看到的模态框。 (İ还没有将otehr输入放入模态中。后来我会放。)

 <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
 <div class="modal-dialog">
 <div class="modal-content">
 <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
    <h4 class="modal-title" id="myModalLabel">Modal title</h4>
  </div>
  <div class="modal-body">
    <input name="barkod_no" value="<?php echo $sto_barkod1; ?>">
    <input name="fatura_no" value="<?php echo $stok_kodu1; ?>">
  </div>
   </div>
 </div>
 </div>

我也使用这个javascript来打开模态框:

 <script>
 $('#barkod_oku').submit(function () {

    $('#myModal').modal('show');
 });
</script>

很快我认为一切正常,但模态不会停留在屏幕上。它出现然后在一秒钟内消失。在屏幕上看不到模态的缺点是什么?

1 个答案:

答案 0 :(得分:1)

您需要使用 Prevent the default action of a submit button

$('#barkod_oku').submit(function () {
    event.preventDefault();
    $('#myModal').modal('show');
 });