Désactiver le groupe de boutons d’amorçage Twitter

J’ai un groupe de boutons sur une page qui est utilisé pour une sélection. Une fois la sélection effectuée, je souhaite que le groupe de boutons rest visible afin que l’utilisateur puisse voir la sélection qu’il a effectuée, mais je ne souhaite plus qu’ils puissent l’utiliser. Est-il possible de désactiver le groupe de boutons?

Vous pouvez utiliser l’atsortingbut disabled sur les boutons pour désactiver leur utilisation, comme décrit dans la documentation Bootstrap . Cela consiste essentiellement à append l’atsortingbut ‘disabled’ à l’élément button, comme ceci;

 

Vous pouvez utiliser jQuery pour append dynamicment cet atsortingbut une fois que vous avez fait ce que vous voulez.

 $('.btn-group-vertical button').attr('disabled','disabled'); 

Et si vous vouliez le réactiver

 $('.btn-group-vertical button').removeAttr('disabled'); 

Gardez à l’esprit que ce qui précède appliquerait ce comportement à tous les groupes de boutons portant ce nom de classe. Si vous ne le souhaitez pas, vous devrez append un ID au groupe btn et l’utiliser dans le sélecteur jQuery.

Je voulais aussi conserver le style. J’ai donc laissé le champ pour personnes handicapées et contre-agi le CSS avec une nouvelle classe en display-only :

 

Et le CSS:

 .btn-group.display-only label.btn { pointer-events: none; cursor: not-allowed; } .btn-group.display-only label.btn.active { opacity: 1; color: #333; background-color: #e6e6e6; border-color: #adadad;webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,.125); box-shadow: inset 0 3px 5px rgba(0,0,0,.125); } 

..Semble bien fonctionner pour moi.

Avant la v4.0.0, les boutons Bootstrap Toggle n’honorent pas .disabled ou [disabled]:

https://github.com/twbs/bootstrap/issues/21237