bootstrap-combobox icon indicating copy to clipboard operation
bootstrap-combobox copied to clipboard

Bootstrap 5 Floating Label - additional feature

Open tnegroup opened this issue 2 years ago • 0 comments
trafficstars

If anybody is interested, I modified the constructor template so that it allows for a floatingLabel option string to be added and it will behave the same way as floating labels in Bootstrap 5:

image

  , template: function() {
      if (this.options.bsVersion == '2') {
        return '<div class="combobox-container"><input type="hidden" /> <div class="input-append"> <input type="text" autocomplete="off" /> <span class="add-on dropdown-toggle" data-dropdown="dropdown"> <span class="caret pulldown" style="vertical-align: middle"/> <i class="icon-remove remove"/> </span> </div> </div>'
      } else if (this.options.bsVersion == '3') {
        return '<div class="combobox-container"> <input type="hidden" /> <div class="input-group"> <input type="text" autocomplete="off" /> <span class="input-group-addon dropdown-toggle" data-dropdown="dropdown"> <span class="caret pulldown" /> <span class="glyphicon glyphicon-remove remove" /> </span> </div> </div>'
      } else {
        return '<div class="combobox-container"> <input type="hidden" /> <div class="input-group"> ' + (this.options.floatingLabel ? '<div class="form-floating">' : '') + '<input type="text" autocomplete="off" />'
            + (this.options.floatingLabel ? '<label for="' + this.$source.attr('id') + '" class="form-label">' + this.options.floatingLabel + '</label></div>' : '')
              + '<div class="input-group-text dropdown-toggle' + (this.options.iconCaret ? ' custom-icon' : '') + '" '+ (hasPopper ? ' data - toggle="dropdown" data - reference="parent"' : '') + ' > '
              + (this.options.iconCaret ? '<span class="' + this.options.iconCaret + ' pulldown" />' : '')
              + (this.options.iconRemove ? '<span class="' + this.options.iconRemove + ' remove" />' : '<span class="utf-remove remove" />')
          + '</div> </div> </div>';
      }
    }

tnegroup avatar May 23 '23 13:05 tnegroup