显示静态不可点击的AutoCompleteExtender列表标题 [英] Show static non-clickable heading in AutoCompleteExtender list

问题描述

我从Ajax控件工具包的AutoCompleteExtender。我需要在下拉列表中显示的项目有多少找到了航向，但它不应该是可选择的项目。

我已经尝试了这个使用jQuery，但即使我只是添加为一个div，当我点击它，它仍然是选择作为项目的文本框中：

 函数clientPopulated（发件人，发送）{
    VAR completionList = $找到（AutoCompleteEx）get_completionList（）。
    VAR completionListNodes = completionList.childNodes;
    对于（i = 0; I＆LT; completionListNodes.length;我++）{
        completionListNodes [I] .title伪= completionListNodes [I] ._ value.split（'：'）[2];
    }
    VAR resultsHeader;
    如果（completionListNodes.length == 1000）
       resultsHeader ='1000最大数量达＆LT; BR /＆gt;请缩小搜索范围。;
    否则如果（completionListNodes.length大于0）
        resultsHeader = completionListNodes.length +'命中';
    其他
        resultsHeader = msg_NoObjectsFound;
    jQuery的（completionListNodes [0]）之前。（'＆LT; D​​IV＆GT;'+ resultsHeader +'＆LT; / DIV＆GT;'）;
}
 

解决方案

添加 OnClientItemSelected 和 OnClientShowing 事件处理程序和试试下面的脚本：

 函数itemSelected（发件人，参数）{
     如果（args.get_value（）== NULL）{
          sender._element.value =;
     }
}功能clientShowing（）{
     VAR扩展= $找到（AutoCompleteEx）;
     变种optionsCount = extender.get_completionSetCount（）;     VAR消息=;
     如果（optionsCount == 1000）{
          消息='1000最大数量达＆LT; BR /＆gt;请缩小搜索范围。;
     }
     否则如果（optionsCount大于0）{
          消息= optionsCount +命中。
     }
     其他{
          消息=糟糕。
     }     jQuery的（extender.get_completionList（））prePEND。（＆LT;李风格=背景色：#CCC重要;'＆gt;中+信息+＆LT; /李＆GT;）;
}
 

补充：
你甚至可以做到这一点没有 OnClientItemSelected 处理程序：

 函数clientShowing（）{
     VAR扩展= $找到（AutoCompleteEx）;
     VAR oldSetText = extender._setText;
     extender._setText =功能（项目）{
          如果（item.rel ==头）{
               extender._element.value =;
               返回;
          }
          oldSetText.call（扩展，项目）;
     };     变种optionsCount = extender.get_completionSetCount（）;     VAR消息=;
     如果（optionsCount == 1000）{
          消息='1000最大数量达＆LT; BR /＆gt;请缩小搜索范围。;
     }
     否则如果（optionsCount大于0）{
          消息= optionsCount +命中。
     }
     其他{
          消息=糟糕。
     }     jQuery的（extender.get_completionList（））prePEND。（＆LT;李相对='头'风格=背景色：#CCC重要;'＆gt;中+信息+＆LT; /李＆gt;中） ;
}
 

I have an AutoCompleteExtender from the Ajax Control Toolkit. I need to have a heading in the dropdown list that shows how many items found, but it should not be selectable as an item.

I have tried this using jQuery, but even when I just add as a div, it is still selected as an item into the text box when I click on it:

function clientPopulated(sender, e) { 
    var completionList = $find("AutoCompleteEx").get_completionList();
    var completionListNodes = completionList.childNodes; 
    for (i = 0; i < completionListNodes.length; i++) { 
        completionListNodes[i].title = completionListNodes[i]._value.split(':')[2]; 
    } 
    var resultsHeader;
    if(completionListNodes.length==1000)
       resultsHeader = 'Max count of 1000 reached.<br/>Please refine your search.';
    else if(completionListNodes.length>0)
        resultsHeader =  completionListNodes.length + ' hits.';
    else 
        resultsHeader = msg_NoObjectsFound ;
    jQuery(completionListNodes[0]).before('<div>' + resultsHeader + '</div>');
}

解决方案

Add OnClientItemSelected and OnClientShowing events handlers and try script below:

function itemSelected(sender, args) {
     if (args.get_value() == null) {
          sender._element.value = "";
     }
}

function clientShowing() {
     var extender = $find("AutoCompleteEx");
     var optionsCount = extender.get_completionSetCount();

     var message = "";
     if (optionsCount == 1000) {
          message = 'Max count of 1000 reached.<br/>Please refine your search.';
     }
     else if (optionsCount > 0) {
          message = optionsCount + " hits."
     }
     else {
          message = "oops."
     }

     jQuery(extender.get_completionList()).prepend("<li style='background-color:#ccc !important;'>" + message + "</li>");
}

Added: you even can do this without OnClientItemSelected handler:

function clientShowing() {
     var extender = $find("AutoCompleteEx");
     var oldSetText = extender._setText;
     extender._setText = function (item) {
          if (item.rel == "header") {
               extender._element.value = "";
               return;
          }
          oldSetText.call(extender, item);
     };

     var optionsCount = extender.get_completionSetCount();

     var message = "";
     if (optionsCount == 1000) {
          message = 'Max count of 1000 reached.<br/>Please refine your search.';
     }
     else if (optionsCount > 0) {
          message = optionsCount + " hits."
     }
     else {
          message = "oops."
     }

     jQuery(extender.get_completionList()).prepend("<li rel='header' style='background-color:#ccc !important;'>" + message + "</li>");
}

这篇关于显示静态不可点击的AutoCompleteExtender列表标题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！