Click here to Skip to main content
12,952,273 members (43,862 online)
Click here to Skip to main content
Add your own
alternative version


Posted 17 Dec 2011

Multiple re-search on WordPress table reloaded plugin

, 17 Dec 2011 CPOL
Rate this:
Please Sign up or sign in to vote.
This tip explains how to enable multiple table searches


If you use WP-table-reloaded plugin, you know that you can insert multiple tables on the same WordPress post, but you can search inside only one table at a time. This article explains how to enable multiple table search. You have to know what WordPress is, and you have to use WP-table-realoded plug-in, a must have plug-in IMHO. This article uses jQuery and DataTables JS Library, if you want you can learn them here: jQuery - DataTable

Using the code

You have to insert this code:

<script type="text/javascript">

inside the header.php file of your current WordPress theme. The code is composed of two parts: the function myFilter is executed when the button is clicked; so the value of the input is retrieved and passed to the right JS DataTables object.

function myFilter(){
    theval = jQuery('#maininput').val();
    oTable3 = jQuery('#wp-table-reloaded-id-3-no-1')
    oTable4 = jQuery('#wp-table-reloaded-id-4-no-1')
jQuery(document).ready(function() {
    .before('<h3>SEARCH TEST:</h3><p>
      <input id="maininput" type="text">
      <input type="button" id="btnSearch"  önClick="myFilter();"
      value="SEARCH" /></p><br />');

Points of Interest

  • First of all, please note that "#wp-table-reloaded-id-3-no-1" is the CSS ID of the table generated by the plug-in (and also the other one, of course).

  • I'm using the jQuery operator instead of "$" standard operator to avoid interference with other JavaScript libraries.

  • The whole HTML is inserted in the Post with JavaScript, so you'll find this search field in EVERY post of your site, if you want to embed only in some posts you have to modify jQuery('div.PostContent').before... with the correct selection of DOM node where to insert the HTML generated.


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

Web Developer TaloWeb
Italy Italy
Web developer – Information services – translator

Title of Study: degree in computer science

Area of Expertise: Web programming in ASP.NET (C# and VB.NET)

Good Skills: indows Server 2003/2008, Active Directory, Security, Firewall (Watchguard), VPN, DataBase Management (SQL Server 2k/2005, OODBMS), Object Orientation, ASP, ASP.NET, Ajax, C#, XML;

Some knowledge: PHP, VBSCRIPT, MySql, PhpMyAdmin, Hosting management, DNS, VB.NET, Mdaemon mail server, Video Surveillance, WordPress, Graphic Design;

You may also be interested in...

Comments and Discussions

-- There are no messages in this forum --
Permalink | Advertise | Privacy | Terms of Use | Mobile
Web01 | 2.8.170525.1 | Last Updated 17 Dec 2011
Article Copyright 2011 by taloweb
Everything else Copyright © CodeProject, 1999-2017
Layout: fixed | fluid