当使用
the jquery ui autocomplete组合框时,可以为组合框设置默认值吗?
解决方法
我试着用我自己的项目来解决这个问题.
我从您发布的页面中读取演示源代码.在生成自动完成组合框的jquery代码中,我添加了一行代码,当创建组合框时,它会从“select”元素中读取所选值.这样,您可以以编程方式设置默认值(就像您通常不使用自动完成组合框一样)
这是我添加的一行:
input.val( $("#comboBox option:selected").text());
干净利落.它将输入的值设置为#comboBox中所选元素的文本值.当然,您需要更新id元素以匹配您的单个项目或页面.
这是在上下文中:
(function($) { $.widget("ui.comboBox",{ _create: function() { var self = this; var select = this.element.hide(); var input = $("<input>") .insertAfter(select) .autocomplete({ source: function(request,response) { var matcher = new RegExp(request.term,"i"); response(select.children("option").map(function() { var text = $(this).text(); if (this.value && (!request.term || matcher.test(text))) return { id: this.value,label: text.replace(new RegExp("(?![^&;]+;)(?!<[^<>]*)(" + $.ui.autocomplete.escapeRegex(request.term) + ")(?![^<>]*>)(?![^&;]+;)","gi"),"<strong>$1</strong>"),value: text }; })); },delay: 0,change: function(event,ui) { if (!ui.item) { // remove invalid value,as it didn't match anything $(this).val(""); return false; } select.val(ui.item.id); self._trigger("selected",event,{ item: select.find("[value='" + ui.item.id + "']") }); },minLength: 0 }) .addClass("ui-widget ui-widget-content ui-corner-left"); // This line added to set default value of the comboBox input.val( $("#comboBox option:selected").text()); $("<button> </button>") .attr("tabIndex",-1) .attr("title","Show All Items") .insertAfter(input) .button({ icons: { primary: "ui-icon-triangle-1-s" },text: false }).removeClass("ui-corner-all") .addClass("ui-corner-right ui-button-icon") .click(function() { // close if already visible if (input.autocomplete("widget").is(":visible")) { input.autocomplete("close"); return; } // pass empty string as value to search for,displaying all results input.autocomplete("search",""); input.focus(); }); } }); })(jQuery);