title: bootstrap modal disappears immediately
body: <p>I have a form on my website. When the submit button is activated I would like a bootstrap modal to appear and stay until you press the button on the modal to get back to the main menu. 
  The modal appears for a second and then disappears. When I press the 'back' button on my browser window the modal then appears and stays until I press the 'ok' button on the modal. 
  Any suggestions to a solution?</p>
  
  <pre><code>&lt;html lang="en"&gt;
  
  &lt;head&gt;
      &lt;meta charset="utf-8"&gt;    
      &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
      &lt;link href="css/bootstrap_cerulean.min.css" rel="stylesheet"&gt;
      &lt;style type="text/css"&gt;
      body {padding-top:20px;}    &lt;/style&gt;
      &lt;script src="http://code.jquery.com/jquery-1.10.2.min.js"&gt;&lt;/script&gt;
      &lt;script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js"&gt;           &lt;/script&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;div class="container"&gt;
  &lt;div class="row"&gt;
    &lt;div class="col-md-6 col-md-offset-3"&gt;
      &lt;div class="well well-sm"&gt;
        &lt;form class="form-horizontal" action="" method="post"&gt;
         &lt;fieldset&gt;
          &lt;legend class="text-center"&gt;Udlevering af rute&lt;/legend&gt;
  
          &lt;!-- Bud input--&gt;
          &lt;div class="form-group"&gt;
            &lt;label class="col-md-3 control-label" for="Bruger"&gt;Avisbud&lt;/label&gt;
            &lt;div class="col-md-9"&gt;
              &lt;input id="Bruger" name="Bruger" type="text" placeholder="Skriv bud navn" class="form-control"&gt;
            &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;!-- Avisrute nr.--&gt;
          &lt;div class="form-group"&gt;
            &lt;label class="col-md-3 control-label" for="Rute nr"&gt;Rute nr.&lt;/label&gt;
            &lt;div class="col-md-9"&gt;
              &lt;input id="Rute nr" name="Rute nr" type="text" placeholder="Skriv rute nr." class="form-control"&gt;
            &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;!-- Form actions --&gt;
          &lt;div class="form-group"&gt;
            &lt;div class="col-md-12 text-center"&gt;
              &lt;button type="submit" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#udlevering_Modal"&gt;Udlevér rute&lt;/button&gt;
            &lt;/div&gt;
          &lt;/div&gt;
        &lt;/fieldset&gt;
        &lt;/form&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;&lt;script type="text/javascript"&gt;
  &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  
  
  &lt;html lang="en"&gt;
  
  &lt;head&gt;
  &lt;meta charset="utf-8"&gt;    
  &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
  &lt;link href="css/bootstrap_cerulean.min.css" rel="stylesheet"&gt;
  &lt;style type="text/css"&gt;
      body {padding-top:20px;}    &lt;/style&gt;
  &lt;script src="http://code.jquery.com/jquery-1.10.2.min.js"&gt;&lt;/script&gt;
  &lt;script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js"&gt;       &lt;/script&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;div class="modal fade" id="udlevering_Modal" tabindex="-1" role="dialog" aria-labelledby="basicModal" aria-hidden="true"&gt;
        &lt;div class="row"&gt;
        &lt;div class="col-md-6 col-md-offset-3"&gt;
        &lt;div class="well well-sm"&gt;
           &lt;div class="alert alert-success" role="alert"&gt;Rute udleveret.&lt;/div&gt;&lt;br /&gt;
          &lt;a class="btn btn-lg btn-primary btn-large" href="manuel_opret.php" role="button"&gt;&lt;span class="glyphicon glyphicon-briefcase"&gt;&lt;/span&gt;  Til manuel menu &amp;raquo;&lt;/a&gt; 
          &lt;/div&gt;
       &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;&lt;script type="text/javascript"&gt;
  &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>