2014-05-21 3 views
0

J'ai utilisé ce plugin pour multiselect et ci-dessous est mon code. Seul le bouton est affiché. La liste déroulante n'apparaît pas et j'ai échoué à trouver où cela ne va pas. Veuillez suggérer.Multiselect déroulant dans bootstrap

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <title>Form</title> 

    <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet"> 
    <link rel="stylesheet" href="css/bootstrap-multiselect.css" type="text/css"> 
    <link rel="stylesheet" href="css/prettify.css" type="text/css"> 

    <script src="bootstrap/js/bootstrap.min.js"></script> 
    <script type="text/javascript" src="js/jquery-2.1.0.min.js"></script> 
    <script type="text/javascript" src="js/bootstrap-multiselect.js"></script> 
    <script type="text/javascript" src="js/prettify.js"></script> 

</head> 
<body> 

<form name="form1" class="form-horizontal" action="http://blahblah/blah/detr.php" onsubmit="return validateForm();" method="get"> 
<div class="component"> 
<div class="form-group"> 

     <div class="form-group" style="text-align:center;"> 
       <img src="img/img.png" alt="Form" /> 
       <h2>Form </h2> 
       <br /> 
     </div> 
     <label class="col-md-4 control-label" for="selectmultiple">Items</label> 
    <div class="col-md-4"> 
     <select class="multiselect" multiple="multiple"> 
      <option value="cheese">Cheese</option> 
      <option value="tomatoes">Tomatoes</option> 
      <option value="mozarella">Mozzarella</option> 
      <option value="mushrooms">Mushrooms</option> 
      <option value="pepperoni">Pepperoni</option> 
      <option value="onions">Onions</option> 
     </select> 
    </div> 
</div> 
</div> 
</form> 

    <script type="text/javascript"> 

    $(document).ready(function() { 
    $('.multiselect').multiselect(); 
    }); 


</script> 
</body> 
</html> 
+0

Vos toutes les bibliothèques 'jQuery' correctement défini? – Ranjith

Répondre

2

Parce que vous chargez le bootstrap avant jquery. Vous devez d'abord charger la bibliothèque jquery. Changer l'ordre de charge de script de l'étiquette de tête:

de:

<script src="bootstrap/js/bootstrap.min.js"></script> <!-- put it below--> 
<script type="text/javascript" src="js/jquery-2.1.0.min.js"></script> 

changement

<script type="text/javascript" src="js/jquery-2.1.0.min.js"></script> 
<script src="bootstrap/js/bootstrap.min.js"></script> 
+0

Mon mauvais. Merci beaucoup, je ne le savais pas. – rick

Questions connexes