Select2 – Wie Sie die „schließen“ – Symbol rechts neben dem ausgewählten Element

Ich bin mit select2 für die Darstellung einer mehrfach-Auswahl-Komponente. Anstatt zu zeigen das Symbol zum schließen(x) auf der linken Seite des Elements, wie kann ich verschieben Sie es auf der rechten Seite des ausgewählten Elements?

  • Sie könnte wahrscheinlich verwenden Sie css, um das zu tun, aber es gibt keine code-Beispiel in der Frage so idk
InformationsquelleAutor It’sMe | 2016-08-12



3 Replies
  1. 7

    Wenn Sie hinzufügen float: right; zu den .select2-selection__choice__remove css-Klasse, damit wird es auf der rechten Seite.

    EDIT: Wenn Sie nicht möchten, berühren Sie das select2-stylesheets, Sie können immer mit jquery und tun Sie etwas wie dieses:

    $('.select2').on('select2:open', function () {
      $('.select2-selection__choice__remove').addClass('select2-remove-right');
    });
    

    .select2-remove-right {
      float: right;
    }
    
  2. 1

    Können Sie verschieben Sie das x mit CSS nur durch hinzufügen in Ihre css-Datei ein code wie dieser:

      .select2-container-multi .select2-search-choice-close {
        left: auto;
        right: 3px;
      }
    
      .select2-container-multi .select2-choices .select2-search-choice {
        padding-right: 18px;
        padding-left: 5px;
      }
    
  3. 1
    .select2-selection__choice__remove {
        float: right;
        margin-left: 5px /* I added to separate a little bit */
    }
    

    Select2 - Wie Sie die

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.