Bootstrap Modal在编辑窗体上显示时立即关闭


Bootstrap Modal immediately closes when showing on edit form

我需要一些帮助,我已经读了很多文章,但还没有找到解决问题的方法。

正如你在图片中看到的,我的模式按钮在一个表中,但当我点击取消编辑按钮时,它会显示编辑表单的取消模式,但它会在中关闭

这是我的按钮代码,我使用php和引导程序:

echo "<td><a href='consultar_usuario.php?id_trabajador=$arreglo[0]&idactualizar=3'><img src='../imagenes/Iconos/actualiza.png' class='img-rounded' data-toggle='modal' data-target='#myModal'></td>";

这是我的模态代码:

echo'
  <div class="control-group modal fade" id="myModal" role="dialog">
      <div class="modal-dialog">
         <div class="modal-content">
           <div class="modal-header">
           <button type="button" class="close" data-dismiss="modal">&times;</button>
            <h3 class="modal-title">Modificar Empleado</h3>
            </div>
           <form action="../validar_form/valida_actualizacion.php" method="post" class="form-horizontal modal-body">

在我的项目中,所有的div和form都很接近。

我真的很感激你的帮助。

我有一个建议,希望这能有所帮助。

此行:

echo "<td><a href='consultar_usuario.php?id_trabajador=$arreglo[0]&idactualizar=3'><img src='../imagenes/Iconos/actualiza.png' class='img-rounded' data-toggle='modal' data-target='#myModal'></td>";

你能把它改成这个吗:

echo "<td><a href='consultar_usuario.php?id_trabajador=$arreglo[0]&idactualizar=3'><img src='../imagenes/Iconos/actualiza.png' class='img-rounded modal_clicker'></td>";

并添加以下javascript:

<script>
 $(".modal_clicker").on("click", function(){
  $('#myModal').modal('show');
});
</script>

这样,您就可以回显"modal_clicker",而不必一遍又一遍地重复"data toggle='modal'data target='#myModal'"。

对于你的问题,我希望这个代码能有所帮助:

<script>
 $("#myModal").modal({
  backdrop: 'static',
  keyboard: false})
</script>

【固定/解决方案】

我找到了原因。你每次点击链接都试图打开一个新的url;此处为<a href='consultar_usuario.php?id_trabajador=$arreglo[0]&idactualizar=3'>

解决方法是将您的href或链接更改为此。

<a href='javascript:void(0);'>

如果您想访问这些:id_trabajador=$arreglo[0]&idactualizar='3'

尝试将其作为数据-*添加到您的链接中。请参阅下面的示例。

<a href='javascript:void(0);' class="modal_clicker" data-id_trabajador='".$arreglo[0]."' data-idactualizar=3'>

然后,您可以使用以下javascript访问这些数据-*:

$(".modal_clicker").on("click", function(){
 var ele = $(this);
 var id_trabajador = ele.attr("data-id_trabajador"); 
 var idactualizar= ele.attr("data-idactualizar"); 
 $('#myModal').modal('show');
});