在bootstrap typeahaead下拉列表中使用延迟加载

时间:2015-10-03 05:44:26

标签: javascript jquery bootstrap-typeahead

我有一个自定义模板下拉(combobox)bootstrap typeahead有940个元素,每个元素也有图像。

因此,在页面加载时我必须首先显示dropdown-combobox中可用的所有元素,如果用户键入了结果,则结果将被过滤。

当我必须显示所有940元素时,是否有任何方法可以使用延迟加载或任何其他功能来提高其加载时的性能。

代码

$('#scrollable-dropdown-menu .typeahead').typeahead({"highlight":true}, {
         name: 'fabrics',
         limit: 940,
         minLength: 0,
         display: function(){
            return '';
            },
         source: substringMatcher(fabrics),         
         templates: {
            header: function(){
               if(selectedFabric)
                  return selectedFabric
            },
            empty: [ 
               '<div class="empty-message">',
               'No match found',
               '</div>'
            ].join('\n'),
            suggestion: function(query, context){
               option = '<div class="typeRow"><span class="imgBlock"><img src="../../../styles/images/fabric/' 
                                 + query.Text.ImgName + '" alt="Image not found" /></span><div class="desc"><p class="pHead"> ' 
                                 + query.Text.FabricColor + ' ' + query.Text.Openness + ' </p><p class="pModel"><span class="mdl"><small>Model:</small>'
                                 + query.Text.Id +'</span> <span class="smple"><small>Sample:</small>'+ query.Text.Sample +'</span></p></div></div>';
               return option;
            }
         }
      });

0 个答案:

没有答案