自动完成JQuery行分隔符

我已经填充自动完成的单词，我想在单词之间有一个行分隔符，以便在自动完成中更好地识别。说，在下拉值应该呈现为自动完成JQuery行分隔符

  Brijesh 
     ------- 
     John 
     ------- 
     Mike

下面是摘录

$(document).ready(function() { 
$("#studentName").autocomplete({ 
source: function (request, response) { 
    $.ajax({ 
     type: "POST", 
     contentType: "application/json; charset=utf-8", 
     url: "Webservice.asmx/GetStudentNames", 
     data: "{'prefixText':'" + request.term + "'}", 
     dataType: "json", 
     success: function (data) { 
     var regex = new RegExp("(?![^&;]+;)(?!<[^<>]*)(" + request.term.replace(/([\^\$\(\)\[\]\{\}\*\.\+\?\|\\])/gi, "\\$1") + ")(?![^<>]*>)(?![^&;]+;)", "gi"); 
      response($.map(data.d, function (item) { 
       return { 
       label: item.split('|')[0].replace(regex, "<Strong>$1</Strong>"), 
       val: item.split('|')[1] 
       } 
      })) 
     }, 

     failure: function (response) { 
      ServiceFailed(result); 
     } 
    }); 
}, 
select: function (event, ui) { 
txtStudent(ui.item.val, ui.item.label); //Student name and id used in this method 
}, 
minLength: 2 
}); 
});

任何线索，将不胜感激。

来源

2012-03-28 pal

CSS将在这里得到较好的解决IMO，而不是追加 '不可选择' 的选项。只需添加'border-bottom：1px solid＃000; margin：5px 0;'给下拉列表中的每个元素。 – 2012-03-28 11:04:24

如何用CSS模拟分隔符。喜欢的东西：

autocomplete option { 
    padding-bottom: 4px; 
    border-bottom: 1px solid #ccc; 
    margin-bottom: 4px; 
}

来源

2012-03-28 11:06:26 unfrev

我需要一条实线，并且该线应触及下拉框的垂直边框 – pal 2012-03-29 07:52:07

使用CSS

.ui-menu-item{ 
    border-bottom: 1px dotted black; 
}

小提琴这里http://jsfiddle.net/JRM5Y/

来源

2012-03-28 11:14:20

我需要一条实线，并且该线应该触摸下拉框的垂直边框 – pal 2012-03-29 07:51:50

自动完成JQuery行分隔符

回答

相关问题