le placeholder jQuery Select2 ne fonctionne pas
je suis en suivant cette doc http://ivaynberg.github.io/select2/ pour créer boîte de sélection avec placeholder. Mon problème est le placeholder ne fonctionne pas. Pouvez-vous aider à réparer ce code?
Code:http://jsfiddle.net/VwGGU/3/
HTML:
<select style="width:300px" id="source">
<optgroup label="Alaskan/Hawaiian Time Zone">
<option value="AK">Alaska</option>
<option value="HI">Hawaii</option>
</optgroup>
<optgroup label="Pacific Time Zone">
<option value="CA">California</option>
<option value="NV">Nevada</option>
<option value="OR">Oregon</option>
<option value="WA">Washington</option>
</optgroup>
</select>
Javascript:
$("#e2").select2({
placeholder: "Select a State",
allowClear: true
});
L'exemple ci-dessus montre "Alaska" au lieu de "Sélectionner un L'état" en tant que placeholder.
UPDATE 1:
Ajouté select2.js maintenant et vide option. Il continue à ne pas le montrer placeholder
HTML
<select style="width:300px" id="source" placeholder="testt test">
<option></option>
<optgroup label="Alaskan/Hawaiian Time Zone">
<option value="AK">Alaska</option>
<option value="HI">Hawaii</option>
</optgroup>
<optgroup label="Pacific Time Zone">
<option value="CA">California</option>
<option value="NV">Nevada</option>
<option value="OR">Oregon</option>
<option value="WA">Washington</option>
</optgroup>
JS
$(document).ready(function () {
$("#source").select2({
placeholder: "Select a State",
allowClear: true
});
});
UPDATE 2:
étrange que jsfiddle ait fait une erreur quand j'ai copié .css et .js link de github. Cette version fonctionne
HTML
<select style="width:300px" id="source" >
<option></option>
<optgroup label="Alaskan/Hawaiian Time Zone">
<option value="AK">Alaska</option>
<option value="HI">Hawaii</option>
</optgroup>
<optgroup label="Pacific Time Zone">
<option value="CA">California</option>
<option value="NV">Nevada</option>
<option value="OR">Oregon</option>
<option value="WA">Washington</option>
</optgroup>
JS
$(document).ready(function () {
$("#source").select2({
placeholder: "Select a State",
allowClear: true
});
});
7 réponses
select un id de source mais vous ciblez une ide2 dans le sélecteur jQuery, et vous avez besoin d'un vide <option> la balise
Avez-vous fait ceci:
lorsque placeholder est utilisé pour une boîte de sélection non multi-valeurs, il exige que vous incluiez une étiquette vide comme première option
$selectElement.select2({
minimumResultsForSearch: -1,
placeholder: 'Select Relatives'
}).on('select2-opening', function() {
$(this).closest('li').find('input').attr('placeholder','Select Relative');
});
essayez ceci.En html, vous écrivez le code suivant.
<select class="select2" multiple="multiple" placeholder="Select State">
<option value="AK">Alaska</option>
<option value="HI">Hawaii</option>
</select>
et dans votre script, écrivez le code ci-dessous.
<script>
$( ".select2" ).select2( { } );
</script>
<select id="select2Box" class="form-control brand-select">
<option value="">Select Franchise</option>
</select>
vous devez ajouter une balise d'option vide à la select.
<select data-placeholder="Chose number" data-allow-clear="true" data-width="50%">
<option></option>
<option value="1">Number one</option>
<option value="2">Number two</option>
<option value="3">Number three</option>
</select>
Vérifier ce lien Placeholder ne fonctionne que lorsqu'il y a un élément d'option vide
<script>
$( "#id").select2({ placeholder: "Select Franchise" });
</script>