Using the built in search

The built in search is very 1.0 at this point, but it works.   I would consider it more of a filtering than a search. While building the system, it was pretty easy to manage things when there were 2 users and less than 20 pages, but I could see how things could get out of hand pretty quickly if you get large tables (pagination is coming, btw).

So, what the search does is basically filters your tables, but it does it pretty strictly.  In other words, if you have a user named "Admin"  you can't search for "min."  The moment you type A, the search is going to automatically give you ONLY the people whose name (first or username in this example) begins with A.  It can be in any column, but it must begin with A.

The good news is that it can be implemented on any table in your site in 3 easy steps.

Step 1 – Call the Javascript

At the bottom of your template you have a line that says…

<!-- Place any per-page javascript here -->

Paste this line right below it.
<script src="js/search.js" charset="utf-8"></script>

Step 2 – Put in the search bar…

You can format things as you want, but you want to at least put in the following code…
<input class="form-control" id="system-search" name="q" placeholder="YOUR SEARCH TEXT HERE" required>
<span class="input-group-btn">
<button type="submit" class="btn btn-default"><i class="fa fa-search"></i></button>
</span>
</form>

Note that you can edit the search icon and what you want the search box to say by default.

Step 3 – Add a class to your table

The search bar won't know what to search if you don't add a specific class to the table. Note that if you already have a class on it, you can just add another.  So if your class was already "table table-hover" just change that line to say…

<table class='table table-hover table-list-search'>

Regardless of what other classes you have, the table must have the class "table-list-search" or the search won't work.

That's it for now. More features are coming but that's version 1.0 of the integrated search.