Comment Utiliser select2.js

Je veux ajouter un champ de formulaire qui peuvent remplissage automatique de texte & peut prendre plusieurs onglets(similaire à fb).
J'ai trouvé select2.js m'aide à le faire, Mais je vais avoir des problèmes en l'utilisant, lorsque j'ai mis plusieurs attributs de vrai. si j'ajoute à plusieurs: c'est vrai, la page dispalys il normal sélectionner.

Je trouver de la documentation sur select2 page confusion.

Je suis un nouveau à tous, Merci de m'aider.

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>          
<script type="text/javascript" src="select2.js"></script>          

 <link href="select2.css" rel="stylesheet"/>
    <script src="select2.js"></script>
    <script>
        $(document).ready(function() { 
        $("#e1").select2([multiple: true]);
        });
    </script>

</head>
<body>
<input type="button" id="123">click
</br>
<input type="hidden" id="1234">
<select id="e1">
        <option value="AL">Alabama</option>
        <option value="Am">Amalapuram</option>
        <option value="An">Anakapalli</option>
        <option value="Ak">Akkayapalem</option>

        <option value="WY">Wyoming</option>
    </select>

</body>
</html>

OriginalL'auteur petarap | 2013-01-28

  1. 23

    Ajouter l'attribut "plusieurs", et une largeur ainsi, seulement dans le balisage.

    <select multiple id="e1" style="width:300px">

    et js comme ceci:

    $(document).ready(function() { 
 $("#e1").select2();
});

    Voir tripoter ici: http://jsfiddle.net/marcusasplund/jEADR/2/

    Une note de côté; vous êtes de chargement select2.js 2 fois dans le code affiché dans votre question.

    Cela a fonctionné pour moi sur CakePHP. Passé à jamais essayer de comprendre ce qu'est la magie, ils ont travaillé sur la select2 git...Merci.
    Vous n'avez pas besoin de spécifier manuellement une width sur le style.
    Vous avez raison, peut-être que le bit "seulement dans le balisage" était un peu confus. Il pourrait être préférable de spécifier une largeur dans la css. Peut-être, comme vous avez à régler la largeur du conteneur construit par select2 comme ceci: .select2-container-multi { width: 300px } Puis, si on ne précise pas une largeur à tous l'objectif de sélectionner l'élément, le select2 élément va commencer avec seulement 2*5px 0px padding et largeur = 10px. Et c'est peut-être un peu petit pour une bonne expérience utilisateur. Mis à jour le violon ici: lien
    Mais pour afficher une valeur initiale?
    Définir l'attribut sélectionné l'option que vous voulez comme valeur initiale: <option value="Am" selected>Amalapuram</option> Voir tripoter ici:http://jsfiddle.net/jEADR/326/

    OriginalL'auteur MarcusAsplund

  2. 1

    Vous pouvez remplacer la classe spécifique pour select2.js:

    .select2-container-multi .select2-choices {
    width: 150px;
}

    Il devrait fonctionner.

    OriginalL'auteur Kanan Farzali

  3. 1

    Vous pouvez utiliser plusieurs attribut, sélectionnez 

     <html>
  <head>
    <link href="select2.min.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="jquery.js"></script>      
    <script type="text/javascript" src="select2.min.js"></script>     
 </head>
 <body>
    <select multiple id="getCountry">
      <option value="India">India</option>
      <option value="Afghanistan">Afghanistan</option>
      <option value="japan">japan</option>
    </select>
    <input type="button" id="submit" value="Submit">click
    <script>
      $(document).ready(function() {   
        $("#getCountry").select2();   
      });      
    </script>   
  </body>
</html>

    OriginalL'auteur Ravi Patel