web-dev-qa-db-fra.com

Sélection multiple dans Safari iOS 7

Lorsque j'utilise l'option multiple dans un menu déroulant de sélection, Safari rencontre des problèmes étranges. Lorsque je sélectionne une option et que je dis Terminé, la liste déroulante revient à l'affichage de «0 élément». Mais si je sélectionne plusieurs options (plus d'une), tout est sélectionné sauf la première. Après cela, si je désélectionne toutes les options, la dernière reste sélectionnée.

Vérifiez ceci pour une démonstration using safari sur iOS 7.0.3.

<select multiple="multiple">
<option value="1">option 1</option>
<option value="2">option 2</option>
<option value="3">option 3</option>
</select>

J'ai consulté http://www.thecssninja.com/html/optgroup-ios6 , mais je parle de problèmes liés à l'utilisation de optgroups - qui (lorsqu'ils sont utilisés avec plusieurs) semblent actuellement bloquer complètement le safari.

html5selectmobilesafariios7
21
zacropetricopus
    // hack for iPhone 7.0.3 multiselects bug
    if(navigator.userAgent.match(/iPhone/i)) {
        $('select[multiple]').each(function(){
            var select = $(this).on({
                "focusout": function(){
                    var values = select.val() || [];
                    setTimeout(function(){
                        select.val(values.length ? values : ['']).change();
                    }, 1000);
                }
            });
            var firstOption = '<option value="" disabled="disabled"';
            firstOption += (select.val() || []).length > 0 ? '' : ' selected="selected"';
            firstOption += '>&laquo; Select ' + (select.attr('title') || 'Options') + ' &raquo;';
            firstOption += '</option>';
            select.prepend(firstOption);
        });
    }
10
Gromo

Simple ajouter:

<option disabled></option>

en tant que premier élément de sélection multiple.

4
Rodrigo Silva

Ce problème a été partiellement résolu dans la version 7.1 publiée l'autre jour. Cependant, de nombreux problèmes persistent. Le nombre d'articles est maintenant correct, mais ...

  • vous pouvez sélectionner des titres optgroup (vous ne devriez pas pouvoir le faire, et si c'est le cas, il devrait au moins sélectionner/désélectionner tout le groupe.

  • si vous désactivez une option <option disabled="disabled">Computer 1</option>, vous pouvez toujours la sélectionner, ce qui est bien sûr totalement faux.

Rassemblez-vous Apple.

3
user756659

Des bogues "à sélection multiple" dans Safari sous iOS 7.0.3 sur iPhone ont également été rapportés par d'autres sur les forums de discussion d'Apple; par exemple.:

https://discussions.Apple.com/message/23745665#23745665

https://discussions.Apple.com/message/23607781#23607781

Puisque c'est Apple qui devra résoudre ce problème, l'approche consensuelle pour ce que vous pouvez faire pour faciliter la résolution de ce problème, en fonction des messages publiés sur ces deux fils de discussion, consiste à:

  • Recherchez les bogues existants et, si nécessaire, créez un nouveau bogue via Bug Reporter d'Apple.
  • Rejoignez tous les sujets de discussion existants à ce sujet dans les forums de développeurs d’Apple et ouvrez un nouveau sujet si cela n’a pas encore été abordé. (Les discussions ci-dessus ont toutes deux eu lieu sur les forums publics d'Apple, dans la zone "Utilisation de l'iPhone" et, en tant que telles, pourraient ne pas nécessairement être consultées par le service d'assistance aux développeurs d'Apple.)
2
AronR

Il me semble avoir trouvé une solution qui fonctionne mystérieusement avec jQuery. J'imagine que vous pourriez utiliser Vanilla-ify le code si vous ne voulez pas la dépendance jQuery:

/**
 * iOS mutliple select fix.
 */
if (navigator.userAgent.match(/(iPod|iPhone|iPad)/)) {
    $('select[multiple]').each(function() {
        $(this).prepend('<option disabled></option>');
        $(this).append('<optgroup disabled></optgroup>');
    });
}
0
Daniel Dewhurst