如何使用多个过滤器过滤我的搜索结果？ （下拉，关键字等） [英] How can I filter my searchresults with multiple filters? (dropdown, keywords etc)

问题描述

我有一个带有searchfunction的Codeigniter网站。我可以搜索邮政编码和关键字。现在我想在我的searchresults页面上添加searchfilters来缩小搜索结果。

我使用 Fastlivefilter jquery插件，但我想过滤多个事情。

• 包含我的数据库类别的下拉菜单


• 我在输入字段中键入的关键字

我只能使用下拉列表和只有输入，但不能在一起。

也许有更好的方法吗？例如使用 JQuery Filter（）？

我的searchform：

http：// kees.een-site-bouwen.nl/vacatures

如何使用：

• 在小输入中输入9101，即postcode。


• 提交表单，然后点击searchfilters。

解决方案

这里是我为你创建的一个简单的例子，希望它给你的想法， / p>

请考虑包含具有两个搜索字段的 ul li 结构的html

 < ul> 
< li> bob bope< / li> 
< li> bob test< / li> 
< li> bob bones< / li> 
< li> bob bobs< / li> 
< li> test mcBridge< / li> 
< / ul> 
< br> 
搜索：< input id =searchclass =searchlength =24/> 
 Refine< input id =refineclass =searchlength =24/> 
  

这里是 jquery

  $（document）.ready（function（）{
 $（。search）。keyup（function（）{
 $（li）。hide（）; 
 
 if ）！=）{
 var term = $（＃search）。val（）++ $（＃refine）。val（）; 
} else {
 var term = $（＃search）。val（）; 
 
} 
 $（li：contains（'+ term +'））show ）; 
 
}）; 
 
}）; 
  

尝试小写的小提琴

试试我的小提琴大写

我希望这是你要找的，要在第一个字段中写入 bob ，然后在其他字段中输入测试，您将只会看到一个结果

I have a Codeigniter website with a searchfunction. I am able to search on postal code and a keyword. Now I would like to have searchfilters on my 'searchresults' page to narrow the searchresults.

I am using Fastlivefilter jquery plugin now, but I would like to filter on multiple things.

• A dropdown with categories from my database
• Keywords that I type into the input field.

I got it working with ONLY the dropdown and ONLY the input, but not together.

Maybe there's a better way of doing it? Using JQuery Filter() for example?

My searchform:

http://kees.een-site-bouwen.nl/vacatures

How to use:

• type '9101' into the small input, that says 'postcode'.
• Submit the form and click on 'searchfilters' now try.

解决方案

Here is the simple example i have created for you hope it gives you the idea that you are trying to implement

Consider this html that contains the ul li structure with two search fields

<ul>
    <li>bob bope</li>
   <li>bob test</li>
    <li>bob bones</li>
    <li>bob bobs</li>
    <li>test mcBridge</li>
</ul>
<br>
Search: <input id="search" class="search" length="24" />
Refine    <input id="refine" class="search" length="24" />

And here is the jquery which searches as well as refines the results considering the values of both text fields

$(document).ready(function(){
    $(".search").keyup(function(){
        $("li").hide();

        if($("#refine").val()!=""){
        var term = $("#search").val()+" "+$("#refine").val();
        }else{
        var term =$("#search").val();

        }
        $("li:contains('" + term + "')").show();

    }); 

});

Try my fiddle for lower case

Try my fiddle for upper case

I hope this what you were looking for , for testing write bob in first field then write test in other field you will see only one result

这篇关于如何使用多个过滤器过滤我的搜索结果？ （下拉，关键字等）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！