Click here to Skip to main content
Rate this: bad
good
Please Sign up or sign in to vote.
See more: HTML PHP jQuery
Hi I am trying to make an on-page jquery live search, that displays results in a div accordion. The problem I've been facing is when my search is finding results in my body div it hides th corresponding header, so I'm trying to show all the results parents children, but for some reason the search won't work at all.
 
Help would be much appreciated.
 
Here is the part where I create the accordion and the input search:
 
<form>
    <input type="text" id="search">
</form>
<?php
    require_once('admin/connect.php');
    $retval = mysql_query("SELECT ID, Category, Subject, Open, Close, Body, Note FROM oc");
    if(!$retval)
    {
        die('Could not fetch data: ' . mysql_error());
    }
    while($row = mysql_fetch_assoc($retval))
    {
        echo "<div id='wrapper'><div id='header' class='header'>{$row['Subject']}</div>".
            "<div id='body' class='body'>{$row['Body']}<p>".
            "{$row['Note']}</div></div>";
    } 
?>
<script type="text/javascript" src="jquery.quicksearch.js"></script><pre lang="Javascript"><script type="text/javascript">
    $(document).ready(function() 
{
    $('div.header').click(function() {
        $('div.body').slideUp('normal');    
        $(this).next().slideDown('normal');
    }); 
    //$("div.body").hide();
    //$("div.body").first().show();
    });
 
    $('input#search').quicksearch('div', {
    'show': function () {
        $(this).addClass('show');
    },
    'hide': function () {
        $(this).removeClass('show');
    }});
</script>
And here is the search script I'm using, from :
 
(function($, window, document, undefined) 
{   
    $.fn.quicksearch = function (target, opt) 
    {       
        var timeout, cache, rowcache, jq_results, val = '', e = this, options = $.extend(
        {           
            delay: 100,         
            selector: null,         
            stripeRows: null,           
            loader: null,           
            noResults: '',          
            matchedResultsCount: 0,         
            bind: 'keyup',          
            onBefore: function () 
            {               
                return;         
            },          
            onAfter: function () 
            {               
                return;         
            },          
            show: function () 
            {               
                this.parent(".wrapper").children("div.header").style.display = "";
                this.parent(".wrapper").children("div.body").style.display = "";
            },          
            hide: function () 
            {               
                this.parent(".wrapper").children("div.header").style.display = "none";
                this.parent(".wrapper").children("div.body").style.display = "none";            
            },          
            prepareQuery: function (val) 
            {               
                return val.toLowerCase().split(' ');            
            },          
            testQuery: function (query, txt, _row) 
            {               
                for (var i = 0; i < query.length; i += 1) 
                {                   
                    if (txt.indexOf(query[i]) === -1) 
                    {                       
                        return false;                   
                    }               
                }               
                return true;            
            }       
        }, opt);        
 
        this.go = function () 
        {           
            var i = 0,              
                numMatchedRows = 0,             
                noresults = true,               
                query = options.prepareQuery(val),              
                val_empty = (val.replace(' ', '').length === 0);    
 
            for (var i = 0, len = rowcache.length; i < len; i++) 
            {               
                if (val_empty || options.testQuery(query, cache[i], rowcache[i])) 
                {                   
                    options.show.apply(rowcache[i]);                    
                    noresults = false;                  
                    numMatchedRows++;               
                } 
                else 
                {                   
                    options.hide.apply(rowcache[i]);                
                }           
            }           
 
            if (noresults) 
            {               
                this.results(false);            
            } 
            else 
            {               
                this.results(true);             
                this.stripe();          
            }           
 
            this.matchedResultsCount = numMatchedRows;          
            this.loader(false);         
            options.onAfter();          
            return this;        
        };      /*       * External API so that users can perform search programatically.        * */       
 
        this.search = function (submittedVal) 
        {           
            val = submittedVal;         
            e.trigger();        
        };      /*       * External API to get the number of matched results as seen in          * https://github.com/ruiz107/quicksearch/commit/f78dc440b42d95ce9caed1d087174dd4359982d6        * */       
 
        this.currentMatchedResults = function() 
        {           
            return this.matchedResultsCount;        
        };      
 
        this.stripe = function () 
        {           
            if (typeof options.stripeRows === "object" && options.stripeRows !== null)          
            {               
                var joined = options.stripeRows.join(' ');              
                var stripeRows_length = options.stripeRows.length;  
 
                jq_results.not(':hidden').each(function (i) 
                {                   
                    $(this).removeClass(joined).addClass(options.stripeRows[i % stripeRows_length]);                
                });         
            }           
 
            return this;        
        };      
 
        this.strip_html = function (input) 
        {           
            var output = input.replace(new RegExp('<[^<]+\>', 'g'), "");            
            output = $.trim(output.toLowerCase());          return output;      
        };      
 
        this.results = function (bool) 
        {           
            if (typeof options.noResults === "string" && options.noResults !== "") 
            {               
                if (bool) 
                {                   
                    $(options.noResults).hide();                
                } 
                else 
                {                   
                    $(options.noResults).show();                
                }           
            }       
 
            return this;        
        };      
 
        this.loader = function (bool) 
        {           
            if (typeof options.loader === "string" && options.loader !== "") 
            {                
                (bool) ? $(options.loader).show() : $(options.loader).hide();           
            }           
 
            return this;        
        };      
 
        this.cache = function () 
        {           
            jq_results = $(target);         
 
            if (typeof options.noResults === "string" && options.noResults !== "") 
            {               
                jq_results = jq_results.not(options.noResults);         
            }           
 
            var t = (typeof options.selector === "string") ? jq_results.find(options.selector) : $(target).not(options.noResults);          
            cache = t.map(function () 
            {               
                return e.strip_html(this.innerHTML);            
            });         
 
            rowcache = jq_results.map(function () 
            {               
                return this;            
            });         /*           * Modified fix for sync-ing "val".              * Original fix https://github.com/michaellwest/quicksearch/commit/4ace4008d079298a01f97f885ba8fa956a9703d1          * */           
 
            val = val || this.val() || "";          
            return this.go();       
        };      
 
        this.trigger = function () 
        {           
            this.loader(true);          
            options.onBefore();         
            window.clearTimeout(timeout);           
            timeout = window.setTimeout(function () 
            {               
                e.go();         
            }, options.delay);          
            return this;        
        };      
 
        this.cache();       
        this.results(true);     
        this.stripe();      
        this.loader(false);     
        return this.each(function () 
        {           /*           * Changed from .bind to .on.            * */           
            $(this).on(options.bind, function () 
            {               
                val = $(this).val();                
                e.trigger();            
            });     
        }); 
    };
}(jQuery, this, document)); 
https://github.com/riklomas/quicksearch#readme[^]
Posted 22-Mar-13 3:13am
Edited 22-Mar-13 5:01am
v5

1 solution

Rate this: bad
good
Please Sign up or sign in to vote.

Solution 1

I still havn't been able to fix this issue, help would be appreciated.
  Permalink  

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



Advertise | Privacy | Mobile
Web03 | 2.8.1411022.1 | Last Updated 28 Mar 2013
Copyright © CodeProject, 1999-2014
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100