Instant Search

[gloerick]

Hello,

Looking to use this on our www.efpsupply.com, can I please have better instructions to get this working ?
such as how to enable it or where does the search.php script go ?

Thx,
Erick

[AyoobG]

Hello,

Looking to use this on our www.efpsupply.com, can I please have better instructions to get this working ?
such as how to enable it or where does the search.php script go ?

Thx,
Erick

Hi,

1. You need to place searches.php into the root directory (i.e. the first folder), this folder will contain the first most files such as index.php and page_not_found.php...

once done try to see if it works.

2. Also i checked your code and the following 3 files are in their correct places:

jquery.js
instantSearch.js
instantSearch.css

however you can remove jquery.js from your code because you already have a file called jscript_jquery-1.4.min.js. Both of these files are infact the same. To remove this file open jscript_instantSearch.php and remove the following piece of code:

echo '<script type="text/javascript" src="' . DIR_WS_TEMPLATE . 'jscript/jquery.js"></script>' . "\n";

[gloerick]

Hello,

Thank you for the response, and it seems to all be in place now, but is not working, can you please take a look at www.efpsupply.com and try the search and let me know as I see no differance in the search.

Thx Much,
Erick

[AyoobG]

Hello,

Thank you for the response, and it seems to all be in place now, but is not working, can you please take a look at www.efpsupply.com and try the search and let me know as I see no differance in the search.

Thx Much,
Erick

Hi,

searches.php works fine cut and paste the following link into your browser and it will push some results:

http://www.efpsupply.com/searches.php?query=lind

All your files are in their correct places:

I think the problem could lie in instantSearch.js for your spacific site it may be in conflict with other scripts in your site (i think).

Try this on your offline site (not live):

open instantSearch.js delete everthing and replace it with the following code bellow, then refresh the page a msg box should pop up.

try entering 1 letter into the search box and another 2 msgbox should popup.

reply back with result!






//replace with this test code bellow

/**
 * @package Instant Search Results
 * @copyright Copyright Ayoob G 2009-2011
 * @copyright Portions Copyright 2003-2006 The Zen Cart Team
 * @copyright Portions Copyright 2003 osCommerce
 * @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
 */


//This jScript file is used to create our instant search box


//these var's will be used to maintain multiple request
var runningRequest = false;
var request;

//if you want to manually position the result box you can set autoPosition to false
//but make sure to provide the top and left value in instantSearch.css
var autoPosition = true;


var inputboxCurrent;

//checks to see if the document has loaded and is ready
$(document).ready(function () {


	//this will apply the instant search feature to all the search boxes
    var inputBox = $('input[name="keyword"]');
	
	alert("step1, if see some code then this bit works:" + inputBox.parent().html());

	//if you want to add instant search to only a specific box then comment out the var inputBox above
	//and uncomment out the specific search box selector bellow:
	
	//var inputBox = $('#navMainSearch > form[name="quick_find_header"] > input[name="keyword"]');
    //var inputBox = $('#navColumnTwoWrapper > form[name="quick_find_header"] > input[name="keyword"]');
	//var inputBox = $('#searchContent > form[name="quick_find"] > input[name="keyword"]');
	
	
	//this adds a instant search container bellow the search box
	inputBox.before('<div class="resultsContainer"></div>');
	inputBox.attr('autocomplete', 'off');
	
	
	//re-position all the instant search container correctly into their places
	if (autoPosition == true){
		inputBox.each(function (index) {
			var offset = $(this).offset();
			$(this).prev().css("left", offset.left + "px");
			$(this).prev().css("top", ($(this).outerHeight(true) + offset.top) + "px");
		});
	}


	//if the search box losses focus, then the instant search container will be hidden
    inputBox.blur(function () {
        if (inputboxCurrent) {
            var resultsContainer = inputboxCurrent.prev();
            resultsContainer.delay(300).slideUp(200);
        }
    });


	//if we resize the browser or zoom in or out of a page then the instant search container will be hidden
	$(window).resize(function() {
        if (inputboxCurrent) {
            var resultsContainer = inputboxCurrent.prev();
            resultsContainer.hide();
        }
	});


	//the user starts to enter a few characters into the search box
    inputBox.keyup(function () {

		alert("step2 keyup works");
		
		//only the currently selected search box will be used
        inputboxCurrent = $(this);

		//assign a variable to the instant search container
        var resultsContainer = $(this).prev();

        //we capture the words that are being typed into the search box
        var searchWord = $(this).val();
		var replaceWord = searchWord;
		
		//we clean up the word for any unnecessary characters or double spaces
        searchWord = searchWord.replace(/^\s+/, "");
        searchWord = searchWord.replace(/  +/g, ' ');

       
        if (searchWord == "") {

            //if the search value entered is empty, we then hide the instant search container	
            resultsContainer.hide();

        } else {

            //if multiple requests are sent to the server, we then abort any previous request, before a new request is sent
			//this only comes in use if user is a fast typer
            if (runningRequest) {
                request.abort();
            }

            runningRequest = true;
           
			//we then pass on the search word to searches.php
			//searches.php will then look for all the search results 
            request = $.getJSON('searches.php', {query: searchWord}, function (data) {
                
				alert("step3 data length is " + data.length);
				
                if (data.length > 0) {
                    var resultHtml = '';
                    $.each(data, function (i, item) {
						//if any search result are found, a link will be created and placed into the instant search container
                        resultHtml += '<li><a href="' + generateLink(item.pc,item.l) + '"><span class="alignRight">' + formatNumber(item.c) + '</span>' + highlightWord(replaceWord,item.q) + '</a></li>';
                    });
					
					//fill the container with the matching products and categories
                    resultsContainer.html('<ul>'+resultHtml+'</ul>');
					
                    if (!resultsContainer.is(':visible')) {
						
						//auto position container if needs be
						if (autoPosition == true){
							autoPositionContainer(inputboxCurrent, resultsContainer);
						}
						
						//drop down instant search box
                        resultsContainer.slideDown(100);
                    }
					
                } else {
                    resultsContainer.hide();

                }

                runningRequest = false;
            });
        }
    });
});

//this function auto positions the container
function autoPositionContainer(inputBoxCurr, resltsContainer){
	var offsetInput = inputBoxCurr.offset();
	var overFlow = offsetInput.left + resltsContainer.outerWidth(true);
	var winWidth = $(document).width();
	
	if (overFlow > winWidth){ // this checks to see if the container overflows on the right of the window
		var dif = overFlow - winWidth;
		
		if ((offsetInput.left - dif) < 0){// this checks to see if the container overflows on the left of the window
			resltsContainer.css("left", 0 + "px");
		}else{
			resltsContainer.css("left", (offsetInput.left - dif) + "px");
		}
	}else{
		resltsContainer.css("left", offsetInput.left + "px");
	}
	resltsContainer.css("top", (inputBoxCurr.outerHeight(true) + offsetInput.top) + "px");
}

//this function creates the link back to the matching products or categories
function generateLink(productORcategory, productCategoryID)
{
	var l = "";
	if (productORcategory == "p"){
		l = "index.php?main_page=product_info&products_id=" + productCategoryID;
	}else{
		l = "index.php?main_page=index&cPath=" + productCategoryID;
	}
	
	return l;

}


function highlightWord(findTxt,replaceTxt)
{
	var f = findTxt.toLowerCase();
	var r = replaceTxt.toLowerCase();
	var regex = new RegExp('(' + f + ')', 'i');
	return r.replace(regex, '<span class="thinFont">' + f + '</span>')
	
}

function formatNumber(num)
{
	return num.toString().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,");
	
}

[melirlbr]

Having the same issue, installed everything but still not working, looks like some add on conflicts with this new model

[gloerick]

fix does not work, still using 1.3.9 not the new 1.50

[li-he-qi]

Great addon,it helps improve customers experiences very much, I installed it and it works great,
still some questions
1. it only search and show products name, category name, but I think for some sites the product model and product description are also very important, in my case I don't want it to search the category names, so the best method is that we can have switches in the admin to switch on/off these options(products name, product model, product description, category name)

2.Can I switch off searching category names simply by commenting out the following codes in the searches.php? :

//similar to product search but now we search witin categories
	$sqlCategories = "SELECT categories_name, categories_id
			FROM " . TABLE_CATEGORIES_DESCRIPTION . "
			WHERE (categories_name  LIKE :wordSearchPlus:) 
				OR (LEFT(categories_name,LENGTH(:wordSearch:)) SOUNDS LIKE :wordSearch:) 
			ORDER BY  
				field(LEFT(categories_name,LENGTH(:wordSearch:)), :wordSearch:) DESC
			LIMIT 4";
		
	$sqlCategories = $db->bindVars($sqlCategories, ':wordSearch:', $wordSearch, 'string');
	$sqlCategories = $db->bindVars($sqlCategories, ':wordSearchPlus:', $wordSearchPlus, 'string');

	$dbCategories = $db->Execute($sqlCategories);
	
	
	
	if ($dbCategories->RecordCount() > 0) {
	  while (!$dbCategories->EOF) {
		//this searches for the number of products within a category
		$products_count = zen_count_products_in_category($dbCategories->fields['categories_id']); 

		$prodResult = strip_tags($dbCategories->fields['categories_name']);
		if (strtolower(substr($prodResult,0,strlen($wordSearch))) == strtolower($wordSearch)){
			$results[] = array(
				'q'=>$prodResult,
				'c'=>$products_count,
				'l'=>$dbCategories->fields['categories_id'],
				'pc'=>"c"
			);
		}else{
			$resultsAddAfter[] = array(
				'q'=>$prodResult,
				'c'=>$products_count,
				'l'=>$dbCategories->fields['categories_id'],
				'pc'=>"c"
			);	
		}
		
		
		$dbCategories->MoveNext();
	  }
	}
	
}

2.it now don't show disabled products and out of stock products, but it still shows Disabled Category Names which should be fixed

3. better to have a swtch in the admin for show result counting or not
4. the search result page didn't show the full path for a subcategory as the default zencart behaviour.

5 need a place in the admin to define the returned searching result number especially when it comes to website with many products or categories
,sorry for many questions

[Shapirosupply]

I'm trying to install this add on at www.shapirosupply.com and am having problems. All the files are in the right places and my search box is not any different than before. I'm thinking that it could have something to do with the photobucket slideshow but it is still working fine. Any advice? Thanks.

[AyoobG]

You sure you uploaded file, i can't see instant search in source code.

I'm trying to install this add on at www.shapirosupply.com and am having problems. All the files are in the right places and my search box is not any different than before. I'm thinking that it could have something to do with the photobucket slideshow but it is still working fine. Any advice? Thanks.

[Shapirosupply]

You sure you uploaded file, i can't see instant search in source code.

Sorry, I had 'em in the wrong directory. I just moved 'em and it does look like its working now but the results don't look quite right. It looks like its trying to cram many results into the window..