dsjuimtq920056 2017-02-16 09:23
浏览 36
已采纳

在表单提交时调用BS Modal

This is my page, how to get modal after form submit.

I want to get Modal as I am in requirement of doing such task. This is just simple practice modal page for my understanding.

<?php
    if(isset($_POST["btn"]) && $_POST["btn"]=="Submit")
    {
      ?>
      <script type="text/javascript">
      $(window).load(function()
      {
      $('#myModal').modal('show');
      });
        </script>
      <?php
    }
    ?> 

<!DOCTYPE html>
    <html lang="en">
    <head>
      <title>Bootstrap Example</title>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
      <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    </head>
    <body>

    <div class="container">
      <h2>Modal Example</h2>

     <!-- <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button>   -->
         <form method="post">
                <div class="col-sm-4">
                <input type="text" name="text" class="form-control">  <br>
                <input type="submit" name="btn" class="btn btn-danger">
                 </div>
         </form>
      <!-- Modal -->
      <div class="modal fade" id="myModal" role="dialog">
        <div class="modal-dialog">

          <!-- Modal content-->
          <div class="modal-content">


 <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal">&times;</button>
              <h4 class="modal-title">Modal Header</h4>
            </div>
            <div class="modal-body">
              <p>Some text in the modal.</p>
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
          </div>

        </div>
      </div>

    </div>
    </body>
    </html>
  • 写回答

2条回答 默认 最新

  • douan3019 2017-02-19 06:24
    关注

    First of all do not include <script> tags outside the html tags, put them in the <body> or <head> tags. Whenever you are working with the DOM and jQuery, wrap your code in a document ready closure. Ex:

    <script type="text/javascript">
        $(document).ready(function(){
            $('#myModal').modal('show');
        });
    </script>
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

悬赏问题

  • ¥15 错误 LNK2001 无法解析的外部符号
  • ¥50 安装pyaudiokits失败
  • ¥15 计组这些题应该咋做呀
  • ¥60 更换迈创SOL6M4AE卡的时候,驱动要重新装才能使用,怎么解决?
  • ¥15 让node服务器有自动加载文件的功能
  • ¥15 jmeter脚本回放有的是对的有的是错的
  • ¥15 r语言蛋白组学相关问题
  • ¥15 Python时间序列如何拟合疏系数模型
  • ¥15 求学软件的前人们指明方向🥺
  • ¥50 如何增强飞上天的树莓派的热点信号强度,以使得笔记本可以在地面实现远程桌面连接