Comment ouvrir une boîte modale bootstrap après avoir soumis un formulaire par scanner de codes à barres

Question

J'ai une petite forme pour la lecture de codes-barres. Je scanne le code-barres d'un produit et une boîte de bootstrap apparaît. Dans le modal, je poste le numéro de code-barres du produit. Et à l'intérieur du modal il y a une autre forme, qui va récupérer le numéro de code à barres du produit et va remplir certaines entrées et l'insérer dans la table de base de données 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> 

Ceci est la forme dans laquelle je poste 2 valeurs dans la boîte modale.

Et c'est la boîte modale que je veux voir. (Je n'ai pas mis les entrées otehr dans le modal yet.Later je répandrai.)

<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> 

Et je aussi utiliser ce javascript pour ouvrir la boîte modale:

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

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

Peu de temps tout fonctionne bien i pense mais modal ne reste pas à l'écran. Il apparaît puis disparaît en une seconde. Quel est le point manquant que je ne peux pas voir pour tenir le modal à l'écran?

Answer 1

Vous devez utiliser Prevent the default action of a submit button

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