标签: bootstrap-select

silviomoreto/bootstrap-select [title]属性

根据silvio bootstrap-select文档有一个属性[多个标题]:

这是文档:https: //github.com/silviomoreto/bootstrap-select

<select class="selectpciker" multiple title='Choose one of the following...'>
<option>1</option>
<option>1</option>
</select>
Run Code Online (Sandbox Code Playgroud)

它运作良好!但我需要一个选择(不是多个).没有[multiple]属性,[title]属性不起作用.

我没有在silvio bootstrap-select文档中找到单个title属性.

谁能帮助我?

jquery twitter-bootstrap bootstrap-select

3
推荐指数
1
解决办法
8520
查看次数

bootstrap-select:可以使用重音不敏感搜索吗?

我正在使用bootstrap-select来使用data-live-search启用的表单,这样用户既可以键入搜索词,也可以在下拉列表中找到它。但是,下拉列表中有一些带有重音符号的字词,例如:

  • 莱昂
  • 卡斯特利翁
  • 纳耶拉

我们想使引导字段中的搜索字段不区分重音。能做到吗 我搜索了该项目的Github,但没有找到任何东西,除了这个问题:

https://github.com/silviomoreto/bootstrap-select/issues/767

我还不清楚它是最终实现还是什么。

accent-insensitive bootstrap-select

3
推荐指数
1
解决办法
1239
查看次数

使用selectpicker时,下拉列表显示两个下拉列表

我正在使用selectpicker,下拉菜单显示两次,如图所示

(点击此链接查看图片)

当我删除selectpicker类时,它显示正常的下拉列表

<div class="row">
    <div class="col-sm-12">
        <div class="card-box">
            <h4 class="m-t-0 header-title"><b>Select app</b></h4>
            <div class="row">
                <div class="col-md-4">
                    <div class="p-20">
                        <select class="selectpicker" data-style="btn-white">
                            <option>abc</option>
                            <option>xyz</option>
                            <option>123</option>
                        </select> 
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)
$('.selectpicker').selectpicker();
    $(":file").filestyle({input: false});
});
Run Code Online (Sandbox Code Playgroud)

double jquery jquery-selectors bootstrap-select

3
推荐指数
1
解决办法
3135
查看次数

CSS - 我的 Bootstrap 选择 jQuery 插件的宽度和对齐问题

这可能是一个微不足道的做法,但我似乎无法处理它。

我正在使用 Twitter Bootstrap 3.3.6 和 jQuery 1.12.0,并且我还使用“bootstrap-select”jQuery插件

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

  <!-- Latest compiled and minified CSS -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.10.0/css/bootstrap-select.min.css">

  <!-- Latest compiled and minified JavaScript -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.10.0/js/bootstrap-select.min.js"></script>
</head>

<body>
  <br>
  <div>
    <div class="panel panel-primary">
      <div class="panel-heading ">
        <center>
          <select class="selectpicker" id="headingSelect">
            <option>Item 1</option>
            <option selected>Item 2</option>
            <option>Item 3</option>
          </select>
        </center>
      </div>
      <div class="panel-body">
        <center>
          <div class="form-inline">
            <div class="form-group">
              <label class="control-label" …
Run Code Online (Sandbox Code Playgroud)

css jquery twitter-bootstrap bootstrap-select

2
推荐指数
1
解决办法
1694
查看次数

$(select).val().null的长度给出错误

我的表单中有一个select对象,使用Bootstrap-select.js插件进行样式设置.当我初始化选择框,并尝试获取它的值时,null直到我选择一个选项.在我的脚本中,我正在使用: -

$(select).val().length

然而,当这给出了一个错误$(select).val()null.我真的很想得到一个0.

我该怎么做呢?

jquery bootstrap-select

2
推荐指数
1
解决办法
1000
查看次数

自定义引导程序选择文本颜色

我很难更改我选择的颜色。

HTML:

<div class="selectContainer">
  <select name="mySelect" class="form-control pickerSelectClass" id="id_mySelect"></select>
</div>  
Run Code Online (Sandbox Code Playgroud)

JS:

$(document).ready(function() {  
  $(".pickerSelectClass").selectpicker();   

  $("#id_mySelect").html(
    '<option value="0">[Nothing selected]</option>'
    +'<option value="1">Option 1</option>'
    +'<option value="2">Option 2</option>'
  )
  $("#id_mySelect").selectpicker("refresh");
});
Run Code Online (Sandbox Code Playgroud)

我想知道如何:

  1. 选择菜单关闭时更改第一个选项[未选择]的颜色?
  2. 当选择菜单关闭时选择其他选择选项时更改颜色吗?
  3. 打开选择菜单时更改选项的颜色?
  4. 打开选择菜单时悬停选项时更改颜色?
  5. 打开时更改整个选择菜单的背景颜色?

    这是 jsFiddle

css bootstrap-select

2
推荐指数
1
解决办法
3万
查看次数

如果 Bootstrap-Select 中不存在搜索,则添加新选项

我现在有了新的 javascript 库或插件,我喜欢它,它很酷,也很容易使用。这是Silvio Moreto 的引导选择但是现在我正在寻找一种在“没有搜索匹配”的情况下使用实时搜索时在选择上创建、添加或附加新选项的方法。

https://www.electrictoolbox.com/javascript-add-options-html-select/相同,但几乎没有什么不同我希望按钮位于搜索框中,并且可以保存到数据库中

我正在使用以下代码:

$('.selectpicker').selectpicker({
  		style: 'btn-default',
  		width:'100%'
	});
Run Code Online (Sandbox Code Playgroud)
<link rel="stylesheet" type="text/css" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.2/css/bootstrap-select.min.css">
    <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.2/js/bootstrap-select.min.js"></script>
  
 <select class="selectpicker" data-live-search="true" >
  	<option data-tokens="Hotdog" value="Hotdog">Hot Dog</option>
  	<option data-tokens="Burger" value="Burger">Burger</option>
  	<option data-tokens="Sugar" value="Sugar">Sugar</option>
  	<option data-tokens="Donut" value="Sugar">Donut</option>
</select>
Run Code Online (Sandbox Code Playgroud)

我想象这个:

在此处输入图片说明

html javascript ajax twitter-bootstrap bootstrap-select

2
推荐指数
1
解决办法
4301
查看次数

bootstrap selectpicker:使选择下拉菜单成为必需

我正在使用引导选择器,我想设置一个下拉菜单。使引导选择器选择所需的正确方法是什么?(我不想使用任何其他 jquery 插件)。

{!! Form::select('from', [], null, ['class' => 'selectpicker form-control', 'data-live-search' => '1', 'data-size' => '6', 'title' => 'Select a partner',]) !!}
Run Code Online (Sandbox Code Playgroud)

我正在将 selectpicker 用于 laravel 形式的集合中。

bootstrap-select laravel-form

2
推荐指数
1
解决办法
4212
查看次数

Bootstrap selectpicker不显示选项

我有下面的简单代码,但无法正常工作。事实上我正在尝试bootstrap-select - Silvio Moreto在我的项目中使用。当我点击它时,它不显示选项。我将代码缩小到作者给出的基本示例,但仍然存在同样的问题。

我的代码:

$('.selectpicker').selectpicker({
  style: 'btn-info',
  size: 4
});
Run Code Online (Sandbox Code Playgroud)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.4/css/bootstrap-select.min.css">
<!-- Latest compiled and minified JavaScript -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.4/js/bootstrap-select.min.js"></script>
<!-- (Optional) Latest compiled and minified JavaScript translation files -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.4/js/i18n/defaults-fr_FR.min.js"></script>

<select class="selectpicker">
  <option>Mustard</option>
  <option>Ketchup</option>
  <option>Relish</option>
</select>
Run Code Online (Sandbox Code Playgroud)

这是我得到的: 在此输入图像描述

javascript bootstrap-select

2
推荐指数
1
解决办法
1万
查看次数

使用 Bootstrap 4 的 Bootstrap-select jQuery 插件不起作用

为什么Bootstrap-select不能正常使用Bootstrap 4这是代码,它将搜索输入按钮和选项分别显示为两个单独的按钮。

<select class="selectpicker" data-live-search="true">
  <option data-tokens="ketchup mustard">Hot Dog, Fries and a Soda</option>
  <option data-tokens="mustard">Burger, Shake and a Smile</option>
  <option data-tokens="frosting">Sugar, Spice and all things nice</option>
</select>
Run Code Online (Sandbox Code Playgroud)

html bootstrap-select bootstrap-4 bootstrap-selectpicker

2
推荐指数
1
解决办法
1万
查看次数