selectize.js 相关问题

Selectize是一个基于jQuery的混合表单控件,结合了“textbox”和“select”的元素。它包括自动完成,原生感觉键盘导航,并能够利用远程数据源来构建视觉丰富的控件。

我可以覆盖选择输入的 onChange 触发器吗?

我有一个选择输入并想更改其行为。我通常在某个框架(闪亮)中使用选择输入,所以我希望我在这里给出的示例是可以理解和精确的。 ...

回答 1 投票 0

将 Selectize 应用于我的组件中的所有选择

我想将 Selectize 应用于组件中的每个选择标签。 我需要将其作为一个函数的原因是因为我选择了可以通过按钮添加的选项。 我想将 Selectize 应用于组件中的每个 select 标签。 我需要这是一个函数的原因是因为我已经选择了可以通过按钮添加的选项。 <div class="form-group app-label"> <label class="text-muted">Level</label> <select class="rounded" v-model="entry.level"> <option value="1">Level-1</option> <option value="2">Level-2</option> <option value="3">Level-3</option> <option value="4">Level-4</option> </select> </div> <button @click="addEducationEntry" class="btn btn-primary mt-3"> Add More Education </button> ` 脚本> export default { data() { }, methods: { applySelectize() { this.$nextTick(() => { const selects = $(this.$el).find('select'); console.log('Select elements found:', selects.length); // returning 0 everytime selects.each(function () { $(this).selectize(); }); }); }, }, mounted() { this.applySelectize(); }, updated() { this.applySelectize(); }, }; </script> ` 我的所有导入都工作正常,因为我设法通过添加 selectize 手动将 select 添加到 id,但由于我是动态制作它们,所以我无法使用 id 。 我想我发现了我的错误。我更改了功能: 来自: const selects = $(this.$el).find('select'); 至: const selects = $("select");

回答 1 投票 0

如何为 selectize.js 输入设置值?

我有一个表单,我想将一些默认值复制到输入中。表单输入使用 selectize.js 插件。我想以编程方式设置一些表单值。 ...

回答 12 投票 0

Shiny 中的 SelectizeInput - 将选择的一部分加粗

我想更改 SelectizeInput 下拉选项的一部分。例如,如果任何选项以“*”结尾,则“*”应为粗体(或使用更大的字体)。 我不确定

回答 1 投票 0

如何防止 selectizeInput 将空状态发送到闪亮?

我有一个闪亮的应用程序,其中有一个 selectizeInput。只有一个选择是有效的,但应该可以删除输入,这样就可以开始输入以搜索所有选项...

回答 1 投票 0

如何将 onBlur 事件添加到 selectizeInput

我想在用户离开选择输入时触发一个事件。但是对于 selectizeInput 它不起作用,对于 textInput 它只触发一次: 图书馆(闪亮) 用户界面 <- fluidPage(

回答 1 投票 0

更改选择加载网址参数

选择({ 值字段: 'Id', labelField: '名称', 搜索字段: '姓名', 加载:函数(查询,回调){ $.ajax({ url: '/some_url/params?

回答 1 投票 0

更改选择 laod url 参数

选择({ 值字段: 'Id', labelField: '名称', 搜索字段: '姓名', 加载:函数(查询,回调){ $.ajax({ url: '/some_url/params?

回答 1 投票 0

Capybara 与 jquery.selectize 的集成测试

如何使用 jquery.selectize 编写带有表单的水豚集成测试? 我想测试用户输入几个值。

回答 7 投票 0

SelectizeJs:动态生成选择菜单时会创建重复的选择菜单

我正在尝试通过按加号图标动态创建多个选择菜单。 请测试下面的代码,问题是如果我注释掉这一行 selectize_init(select_class,

回答 1 投票 0

jquery selectize $(...).selectize 不是一个函数

尝试使用 jQuery selectize,但它在我的项目中不起作用。 能否请你帮忙? 我的代码: 标头: 尝试使用 jQuery selectize,但它在我的项目中不起作用。 你能帮忙吗? 我的代码: 标题: <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.12.6/css/selectize.bootstrap3.min.css" integrity="sha256-ze/OEYGcFbPRmvCnrSeKbRTtjG4vGLHXgOqsyLFTRjg=" crossorigin="anonymous" /> <script src="../dist/js/3.5.1/jquery.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.12.6/js/standalone/selectize.min.js" integrity="sha256-+C0A5Ilqmu4QcSPxrlGpaZxJ04VjsRjKu+G82kl5UJk=" crossorigin="anonymous"></script> HTML 正文: $(document).ready(function() { $('select[id="nazev_' + <?php echo $i; ?> + '"]').selectize({ sortField: 'text', onInitialize: function() { var s = this; this.revertSettings.$children.each(function() { $.extend(s.options[this.value], $(this).data()); }); } }); }); 出现错误: 未捕获类型错误:$(...).selectize 不是函数 感谢您的帮助。 试试这个方法: $(document).ready($(function() { $('select[id="nazev_' + <?php echo $i; ?> + '"]').selectize({ sortField: 'text', onInitialize: function() { var s = this; this.revertSettings.$children.each(function() { $.extend(s.options[this.value], $(this).data()); }); } }); }));

回答 1 投票 0

超过两个相关的 selectizeInputs 会导致 R Shiny 中的无限循环

在下面的简单示例中,我在选择状态 1 和 2 后无法选择状态 3。它在 2 个状态下工作正常,但一旦我进入三个状态,它就会无限循环 ObserveEvents。如果...

回答 1 投票 0

两个以上的相关选择会导致无限循环

在下面的简单示例中,我在选择状态 1 和 2 后无法选择状态 3。它在 2 个状态下工作正常,但一旦我进入三个状态,它就会无限循环 ObserveEvents。如果...

回答 1 投票 0

闪亮:每个选择的 selectizeInput 工具提示悬停

我希望用户在将鼠标悬停在 selectizeInput 中的分组选项上时看到不同的工具提示。此处针对平面选择向量解决了这个问题。即 choices = c("a", "b", &q...

回答 1 投票 0

如何在单击或键入时在 selectizeInput 中做出相同的选择顺序?

我做了一个选择向量。当我点击 selectizeInput 时,我得到的选择顺序与我的向量中的顺序相同,但是当我开始输入 selectizeInput 时,我的选择顺序与...中的顺序不一样

回答 0 投票 0

selectize.js select 下拉展示默认打开

我在搜索表单中使用 selectize.js,并希望显示默认打开的选择列表。 我正在为我的搜索表单使用 selectize.js,并希望显示默认打开的选择列表。 <select id="select-state" name="state[]" multiple class="demo-default" placeholder="Select Models"> <option value="">Select Models</option> <option value="Tanzania">Tanzania</option> <option value="Kenya">Kenya</option> <option value="Uganda">Uganda</option> <option value="Asia">Asia</option> <option value="Malaysia">Malaysia</option> <option value="Japan">Japan</option> </select> <script> $('#select-state').selectize({ maxItems: 5 }); </script> 我尝试了不同的方法,但都没有用。 通过 jQuery $('#select-state').show().focus().click(); 通过 CSS <style>.selectize-dropdown{ display:block!important; visibility:visible!important;}</style> 试试这个: var select = $('#select-state').selectize({ maxItems: 5 }); var selectize = select[0].selectize; selectize.open(); <link href="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.12.1/css/selectize.css" rel="stylesheet"/> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.12.1/js/standalone/selectize.js"></script> <select id="select-state" name="state[]" multiple class="demo-default" placeholder="Select Models"> <option value="">Select Models</option> <option value="Tanzania">Tanzania</option> <option value="Kenya">Kenya</option> <option value="Uganda">Uganda</option> <option value="Asia">Asia</option> <option value="Malaysia">Malaysia</option> <option value="Japan">Japan</option> </select> 试试这个,它会在控件接收到焦点时立即显示下拉菜单。 https://selectize.dev/docs/usage#configuration var select = $('#select-state').selectize({ maxItems: 5, openOnFocus: true });

回答 0 投票 0

如何在 selectize.js 中设置选中的选项值

我正在尝试设置要在 selectize.js 中选择的选项,该怎么做。 有一些选项可以最初设置。那我该如何设置该值。 我正在尝试设置要在 selectize.js 中选择的选项,该怎么做。 有可以初始设置的选项。那我怎么设置这个值。 <select id="selectize"> </select> var options=[ {value:0, text:"option 0"}, {value:1, text:"option 1"}, {value:2, text:"option 2"}, {value:3, text:"option 3"}, ]; $('#selectize').selectize({ "options":options }); $('#selectize').change(function(){ //$('#result').html("you select value="+$(this).val()); $('#selectize').val(1); }); 请在jsfiddle中找到代码 http://jsfiddle.net/rcun9zmf/ 谢谢, 您必须先使用input[0].selectize选择您的selectize,然后使用selectize的本地方法getValue()。 根据你的小提琴,这应该有效: var options=[ {value:0, text:"option 0"}, {value:1, text:"option 1"}, {value:2, text:"option 2"}, {value:3, text:"option 3"}, ]; $('#selectize').selectize({ "options":options }); $('#selectize').change(function(){ var selectize = $("#selectize")[0].selectize; $('#result').html("you select value="+ selectize.getValue()); }); JsFiddle 如果 selectize 是一个下拉列表并且您想将其用作选择下拉列表,则需要使用 setValue 来设置选定的选项。 假设您已经有了预选值并且已经构建了选择组件并加载所有值。 如果你想动态改变值 var idPreselected = 2; var $select = $('#MySelectizeDropdown').selectize(); var control = $select[0].selectize; control.setValue(idPreselected); 要为选择控件设置初始值,请使用 addItem 方法。 var selectField = $('#yourfield'); if (selectField.length > 0) { var selectField = $('#yourfield')[0].selectize; selectField.addItem(IDTOSET, false); } https://jsfiddle.net/3aapx1m1/ 好吧,留下了关于其他解决方案的打击的评论。看起来 selectize 更喜欢使用常规 DOM 而不是 jQuery,考虑到最近转向 Vanilla JS,这实际上是一件好事。 所以,这是一个更好的解决方案。请记住,不会检查未找到的元素。我相信你能破译它。 (对于批评者来说,OP 中没有任何关于 jQuery 的内容。) document.getElementById("editGenre").selectize.setValue("Rock"); 您可以通过四个简单的步骤实现这一目标: var val= "abc"; $("#txtbox").selectize()[0].selectize.destroy(); $('#txtbox').val(val); $('#txtbox').selectize({ plugins: ['remove_button', 'restore_on_backspace'], persist: false, // createOnBlur: true, create: true, onItemAdd: function () { this.close(); } });

回答 0 投票 0

如何在selectize-search中设置选中值null

我在 jsf 上使用 selectize search,首先我从下拉列表中选择一个值,然后当我从写入区域清除它时,所选值保持不变。但我想将所选值设置为空

回答 0 投票 0

selectize.addOption不是一个函数。

这是我的js代码。我需要在之前声明的selectize对象中添加选项 $(document).ready(function () { var tso = $('.assign-tags').selectize(...)</root>

回答 1 投票 0

检索在单独文件中声明的selectize对象。

在页面的某个点上进行selectize初始化。在文件1的某个地方 $(document).ready(function() { $tagSelectize = $('.assign-tags').selectize({ plugins: ['...

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.