Modal erscheint dann verschwindet - Laravel Blade

Question

Ich habe ein Modal in meiner Blade-Datei, die erscheint, wenn ich auf "Löschen" klicken, aber es blendet fast sofort. Es gibt keine .js-Dateien, die doppelt geladen werden.

Ich habe eine Geige erstellt und geladen alle die gleichen .css und .js-Dateien und den gleichen HTML-Code, wie ich es benutze und es funktioniert gut, ich weiß nicht, warum in meiner App funktioniert es nicht, irgendwelche Vorschläge?

https://jsfiddle.net/cctqdm75/2/

<!-- Main content --> 
     <section class="content"> 
      <!-- Your Page Content Here --> 
      <div class='row'> 
    <div class='col-md-12'> 
     <!-- Box --> 
     <div class="box box-primary"> 
      <div class="box-header with-border"> 
       <h3 class="box-title">Table of organisations</h3> 
       <div class="box-tools pull-right"> 
        <button class="btn btn-box-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse"><i class="fa fa-minus"></i></button> 
        <button class="btn btn-box-tool" data-widget="remove" data-toggle="tooltip" title="Remove"><i class="fa fa-times"></i></button> 
       </div> 
      </div> 
      <div class="box-body"> 
       <p>Lists all organisations, with controls to edit, delete etc.</p> 
           <p><a href="2">test inc</a> -- <a href="2/edit"><i class="fa fa-edit"></i>Edit</a> -- <a href="2/delete" data-toggle="modal" data-target="#delModal" name="delete" id="delete"><i class="fa fa-trash"></i>Delete</a></p> 

           </div><!-- /.box-body --> 
     </div><!-- /.box --> 
    </div><!-- /.col --> 
</div><!-- /.row --> 

        <!-- delete Modal --> 
    <div class="modal fade" id="delModal" 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">Delete Organisation</h4> 
       </div> 
       <div class="modal-body"> 


        <div class="form-group"> 
         <div class="col-md-12"> 
          Deleting an organisation means all records relating to the organisation are purged from the database.<br> 
          There is no way to recover from this! <br> 
          Type DELETE in the box below to delete test inc.<br>        
          <input type="text" id="del" class="form-control" name="del" onkeypress="checkdel(this.value)" onkeyup="checkdel(this.value)"/> 
          <input type="hidden" name="_token" value="xyxyxyxyxyxyxyxyxyxy"> 
          <input type="hidden" name="ref" value="http://localhost:8000/organisations/manage"> 

         </div> 
        </div> 

       </div> 

       <div class="modal-footer"> 
        <input type="btn" class="btn btn-primary" id="btndel" value="Delete" disabled onclick="location.href='/organisations/2/delete'"></input> 

        <input type="btn" class="btn btn-primary" value="Cancel" data-dismiss="modal"></input> 
       </div> 
      </div> 
     </div> 
    </div> 

     </section><!-- /.content --> 
    </div><!-- /.content-wrapper --> 

Answer 1

Wenn Sie die Versionen von jQuery und Bootstrap in jsfiddle, die Sie in externen Ressourcen geschrieben und verwenden die gleiche Version von jsfiddle in Ihrem Code sicher überprüfen zu wollen. Wenn das behebt, dass Ihr Modal nicht verblasst, wissen Sie, dass die Versionen von Bootstrap und jQuery nicht kompatibel sind.