Fuzzy search with twitter bootstrap table elements using JQuery

Now, We are going to discuss about fuzzy search and how we use it in application using Jquery. Before going to the tutorial we must know about fuzzy matching

Fuzzy matching:

Simply it is called as approximate string matching and it is the technique of finding strings that match a pattern approximately rather than exactly.

For this logic implementation, I have used Searchable JQuery plugin. It very tiny and quite simple and it has lot options to search the string from your HTML elements(Not only for table and it finds the string from other  HTML tags also).

It supports following search type

  • Fuzzy matching – approximate string matching based on pattern
  • Strict  – String matching based on case sensitive
  • Default – String matching based on  case insensitive

Now we are going see how to config this plugin to your application. For example i have a table and it contains rows and columns with some data.  And i applied fuzzy search to this table as follows

HTML table:

And then get the plugin js from https://github.com/stidges/jquery-searchable and include it to your application header tag.


That is it. If you want to know options about this plugin then please visit https://github.com/stidges/jquery-searchable.

Thank you…

Demo and Download

  • sheetesh

    can i put data in table from database??

    than is it working

    • azhagupandiyan

      Ya. it will works when get the data from database and put it to html table.

  • Nishant gupta

    Hi Sir your post is Amazing can u get the solution of searching from 3 dropdown box using php and mysql ??

    • azhagupandiyan

      do you wants this search with mysql and php ?

  • http://www.stidges.com/ Stidges

    Thanks for sharing :)

  • http://no Jitender

    Nice tutorial.
    but you are searching with one search box. Can you upgrade it with like search with first name last name . As we put some words in first name and some in last name and this will sort with first and last name.