Question

我有一组2个数组，第1个是整个数组，第2个是第10个数组（第2个是在UI中显示）。我已经实现了列表视图的搜索。

但我需要从整个数组列表中搜索。

<form class="searchbar searchbar-init" data-search-list=".list-block-search" data-search-in=".item-title" data-found=".searchbar-found" data-not-found=".searchbar-not-found">
                    <div class="searchbar-input">
                       <input type="search" placeholder="Search">
                       <a href="#" class="searchbar-clear"></a>
                    </div>
                    <a href="#" class="searchbar-cancel">Cancel</a>
                 </form>

Answer 1

您需要在customSearch选项设置为true的情况下初始化搜索栏。请参阅：http://framework7.io/docs/searchbar.html

以下是自定义搜索的入门示例：

var searchBar = myApp.searchbar('.searchbar', {
    customSearch: true,
    onSearch: function(s) {
        console.log('Searching', s);
    },
    onClear: function(s) {
        console.log('Clearing', s);
    }
});

Answer 2

这就是我能够使用customSearch和ajax Call使其工作的方式

我正在使用Framework7 v3.1.1

var searchbar = app.searchbar.create({
  el: '.searchbar',
  customSearch: true
});

searchbar.on('search', function()
{
  $.ajax({
    url: 'http//:url.com?search='+searchbar.query,
    type: "GET"
  }).fail(function() {}).done(function(data)
  {
    //this is to remove the overlay after the search is done
    $('.searchbar-backdrop').removeClass('searchbar-backdrop-in');
  });
});

我需要在Framework7中实现自定义搜索

2 个答案: