You are here:  » Responsive HTML - Search Form Autocomplete


Responsive HTML - Search Form Autocomplete

Submitted by support on Mon, 2013-03-18 15:41 in

Update: Search Form Autocomplete now available to download as a patch for latest Responsive HTML template.

Hi everyone,

I've had a number of requests recently regarding auto-complete of the search form, and it's really easy to do with the excellent JQuery JavaScript library, so if you'd like to give it a go on your site, here's how!

Firstly, a "service" script needs to be created in order to return search results in JSON (JavaScript Object Notation) format for use by the auto-complete request. To do this, create a new script as follows, saved in your main Price Tapestry installation folder:

searchJSON.php

<?php
  
require("includes/common.php");
  
header("Content-Type: application/json;");
  if (
$_GET["q"])
  {
    
$sql "SELECT DISTINCT(normalised_name) AS name
      FROM `"
.$config_databaseTablePrefix."products`
      WHERE name LIKE '"
.database_safe($_GET["q"])."%' LIMIT 5
      "
;
    if (!
database_querySelect($sql,$products))
    {
      
$sql "SELECT DISTINCT(normalised_name) AS name
        FROM `"
.$config_databaseTablePrefix."products`
        WHERE name LIKE '%"
.database_safe($_GET["q"])."%' LIMIT 5";
      
database_querySelect($sql,$products);
    }
    print 
json_encode(array("totalResultsCount"=>count($products),"products"=>$products));
  }
  exit();
?>

Next, here's a complete replacement for html/searchform.php, including the remote includes to the JQuery style and JavaScript files (you might want to save these locally instead) to support auto-complete:

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<script type='text/JavaScript'>
  $(function() {
  $( "#q" ).autocomplete({
    source: function( request, response ) {
      $.ajax({
        url: "<?php print $config_baseHREF?>searchJSON.php",dataType:"json",data:{q:request.term},
        success: function( data ) {
          response($.map( data.products, function( item ) { return { label:item.name, value:item.name}
          }));
        }
      });
      },
      minLength: 2,
      open: function() { $( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" ); },
      close: function() { $( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" ); }
    })
    .keydown(function(e){ if (e.keyCode === 13) { $("#search").trigger('submit'); }
    });
  });
</script>
<div class='searchform'>
  <form id='search' name='search' action='<?php print $config_baseHREF ?>search.php'>
    <div class="ui-widget">
      <input id='q' name='q' size='30'/>
      <input type='submit' value='<?php print translate("Search"); ?>' />
    </div>
  </form>
</div>

That's it in terms of the auto-complete functionality; but of course it would make sense that if a user submitted the search form from an auto-complete result that they are taken directly to the product page, so to do this, edit search.php and look for the following code at line 6:

  $q = (isset($_GET["q"])?tapestry_normalise($_GET["q"],":\."):"");

...and REPLACE with:

  $q = (isset($_GET["q"])?tapestry_normalise($_GET["q"],":\."):"");
  $sql = "SELECT * FROM `".$config_databaseTablePrefix."products` WHERE normalised_name='".database_safe($q)."'";
  if (database_querySelect($sql,$rows))
  {
    header("Location: ".tapestry_productHREF($rows[0]));
    exit();
  }

Thanks to http://jqueryui.com/autocomplete/

Enjoy!

Cheers,
David
--
PriceTapestry.com

Submitted by henk on Mon, 2013-03-18 20:28

Looks good, also possible with wordpress?

Thx
Henk

Submitted by Bakalinge on Mon, 2013-03-18 22:12

Thanks David !

This is a great mod, very useful and pretty easy to integrate !
For those like me who are already using jQuery, Autocomplete is also compatible with Jquery 1.7 and 1.8..

Submitted by Capricorn on Tue, 2013-03-19 09:55

Hi David,

After replacing the searchform.php the auto complete works fine, but I wonder if something like this JavaScript alert can be added to the searchform code:

I tried the onclick on this page http://www.pricetapestry.com/node/777 but it doesn't work now.

With the new auto complete code, if anyone click on the empty search box it will just load a blank page with this URL showing on the browser: ...site.com/search.php?q=

Thanks.

Submitted by support on Tue, 2013-03-19 10:08

Hi Capricorn,

Rather than having the alert JavaScript attached to the onClick event of the button, instead attach it to the onsubmit event of the form, so where you now have (from the above mod)

<form id='search' action='<?php print $config_baseHREF ?>search.php'>

...REPLACE with:

<form id='search' action='<?php print $config_baseHREF ?>search.php' onsubmit='if (!document.search.q.value) {alert("Please enter a search term");return false;}'>

Cheers,
David.
--
PriceTapestry.com

Submitted by Capricorn on Tue, 2013-03-19 11:01

David,

It didn't work.

This is the code I had before the new auto-complete code:

<div class='searchform' align="center">
   <form name='search' action='<?php print $config_baseHREF ?>search.php'>
     <input type='text' name='q' size='35' value='' />
     <input type='submit' onclick='if (!document.search.q.value) {alert("Please enter a search term");return false;}' value='<?php print translate("Search"); ?>' /></form></div>

Now when I did the ...REPLACE with above:

<div class='searchform' align="center">
   <form id='search' action='<?php print $config_baseHREF ?>search.php' onsubmit='if (!document.search.q.value) {alert("Please enter a search term");return false;}'>
     <input type='text' name='q' size='35' value='' />
     <input type='submit' onclick='if (!document.search.q.value) {alert("Please enter a search term");return false;}' value='<?php print translate("Search"); ?>' /></form></div>

The auto-complete still works, but not the alert part.

Thanks.

Submitted by Capricorn on Tue, 2013-03-19 11:32

Correction: I made a mistake above.

Now when I did the ...REPLACE with above:

 <div class='searchform'>
   <form id='search' action='<?php print $config_baseHREF ?>search.php' onsubmit='if (!document.search.q.value) {alert("Please enter a search term");return false;}'>
     <div class="ui-widget">
       <input id='q' name='q' size='30'/>
       <input type='submit' value='<?php print translate("Search"); ?>' />
     </div>
   </form>
 </div>

The auto-complete still works, but not the alert part.

Thanks.

Submitted by support on Tue, 2013-03-19 12:00

Hi,

Have a go with:

 <div class='searchform'>
<form id='search' action='<?php print $config_baseHREF ?>search.php' onsubmit='JavaScript:if (document.getElementById("q").value=="") { alert("Please enter a search term");return false;}'>
     <div class="ui-widget">
       <input id='q' name='q' size='30'/>
       <input type='submit' value='<?php print translate("Search"); ?>' />
     </div>
   </form>
 </div>

Hope this helps!

Cheers,
David.
--
PriceTapestry.com

Submitted by Capricorn on Tue, 2013-03-19 12:14

Perfect David,

That was fast!

After I removed the extra t from onsubmitt, now it works!

Thanks a lot.

Submitted by support on Tue, 2013-03-19 12:17

Oops - left that in from testing - removed / corrected above!

Cheers,
David.
--
PriceTapestry.com

Submitted by Capricorn on Thu, 2013-03-21 02:02

Hi David,

I just want to make sure I understood what you said above:

----------------------------
including the remote includes to the JQuery style and JavaScript files (you might want to save these locally instead) to support auto-complete:
----------------------------

I notice a delay on page load after using the script with the jquery.com URL, but I tried those two files jquery-1.9.1.js and jquery-ui.js on my HD and everything is fast.

So is it ok to just upload those two js files to my site without having to link to the jquery.com site?

Thanks.

Submitted by support on Thu, 2013-03-21 07:34

That's correct - serving the JQuery files from your own server will generally be faster since it removes the need for a 3rd party DNS look-up by the client. You can use $config_baseHREF in the code to ensure that they files can be found by the browser even when in rewritten virtual sub-directories (e.g. /product/) for example:

<link rel="stylesheet" href="<?php print $config_baseHREF?>jquery-ui.css" />
<script src="<?php print $config_baseHREF?>jquery-1.9.1.js"></script>
<script src="<?php print $config_baseHREF?>jquery-ui.js"></script>

Cheers,
David.
--
PriceTapestry.com

Submitted by Capricorn on Thu, 2013-03-21 10:32

Now is faster, thanks.

David, this is only for information for others that may encounter this bug.

The jquery-ui.css is calling for two missing images:

On line# 802 background: #ffffff url(images/ui-bg_flat_75_ffffff_40x100.png) 50% 50% repeat-x;

And

On line# 841 background: #dadada url(images/ui-bg_glass_75_dadada_1x400.png) 50% 50% repeat-x;

I did a search on Google and saw that a lot of people have reported that bug.

I was going to disable Line 802 and 841 on the jquery-ui.css because I was getting a missing image report everytime a page was loaded, but I decided to look for those images on the net.

After I put those two images in the images/ folder, I no longer get the missing image report, but I don't see any difference in the functionality or color of the auto complete script, so maybe I remove that part of the CSS to make the file smaller and also delete the unneeded images.

Submitted by support on Thu, 2013-03-21 10:39

Thanks for spotting that! Further - it would also be necessary (if using clean URLs) to make sure that any image URLs specified in CSS are absolute rather than relative, in other words

background: #ffffff url(/images/ui-bg_flat_75_ffffff_40x100.png) 50% 50% repeat-x;
background: #dadada url(/images/ui-bg_glass_75_dadada_1x400.png) 50% 50% repeat-x;

(so just "/" inserted infront of images/ - assuming top level installation)

But as you say, no apparent inclusion in the output so may just be best to remove the CSS if not required!

Cheers,
David.
--
PriceTapestry.com

Submitted by enjoymarcus on Thu, 2013-03-21 15:54

Hi David,

Can this work with the multiple-PT search mod? (http://www.pricetapestry.com/node/4651)

If so, any tips?

Thanks,
Marc.

Submitted by support on Thu, 2013-03-21 17:47

Hi Marc,

It would involve n separate database queries to each category installation which may have a performance implication. It can be done for sure, and in a single searchredirJSON.php returning both the category and search result, so that on selecting an auto-complete entry the JavaScript not only populates "q" but also "category"... Bear with me and I'll set-up a test scenario to give it a go...

Cheers,
David.
--
PriceTapestry.com

Submitted by IG on Sat, 2013-03-30 20:58

Hi David

This mod works really great - thanks!

One question: is it possible to have the cursor blinking in the search field when the homepage is called? It seems this functionality somehow got lost.

Cheers,
IG

Submitted by support on Sun, 2013-03-31 08:08

Hello IG,

Ah yes - the name='search' attribute was missing from the search form. Corrected above in this line:

  <form id='search' name='search' action='<?php print $config_baseHREF ?>search.php'>

Cheers,
David.
--
PriceTapestry.com

Submitted by Bakalinge on Tue, 2013-08-20 12:29

Hi David,

I noticed something strange with search results when using this auto complete mod : sometimes, a "null" result appears. A screenshot is worth a thousand words : {link saved}

Do you think it comes from removed products ?

Thanks
Bak

Submitted by support on Tue, 2013-08-20 13:42

Hi Bak,

I've not come across that before - I'm wondering if it something to do with end of line encoding, but if that were the case you'd expect it on every result...

Can you let me know the URL of the corresponding Price Tapestry installation so that I can query searchJSON.php directly with that query and view the JSON response...

Cheers,
David.
--
PriceTapestry.com

Submitted by Bakalinge on Tue, 2013-08-20 14:08

Hi David,

PT is installed there : {link saved}
Try a search like "Givi 4" for a live example.

Thanks
Bak

Submitted by support on Tue, 2013-08-20 14:16

Hello Bak,

The "null" values are being returned in the JSON response, so that would indicate that, perhaps from earlier modifications / testing that some product records have become orphaned in the database with empty or NULL normalised_name fields whilst still containing valid name fields.

It is probably worth purging the database if that's the case - the following dbmod.php script will clear out any records that could result in the null records - see if this does the trick...

<?php
  set_time_limit
();
  require(
"includes/common.php");
  
$sql "DELETE FROM `".$config_databaseTablePrefix."products`
            WHERE normalised_name='' OR normalised_name IS NULL"
;
  
database_queryModify($sql,$result);
  print 
"Done.";
?>

Hope this helps!

Cheers,
David.
--
PriceTapestry.com

Submitted by Bakalinge on Tue, 2013-08-20 14:45

Hi David,

unfortunately the script doesn't solve the problem. Could it come from an XML feed that is already registered but where products are not imported yet ?

Bak

Submitted by support on Tue, 2013-08-20 14:46

Hello Bak,

I'll email you a debug script that will show us the raw DB results for the example query..

Cheers,
David.
--
PriceTapestry.com

Submitted by D.Tzortzis on Sat, 2014-09-06 13:30

Hello this modification is awesome, but i cant get it working....

i have create into main installation folder a php file called "searchJSON.php" with the follow code:

<?php
  
require("includes/common.php");
  
header("Content-Type: application/json;");
  if (
$_GET["q"])
  {
    
$sql "SELECT DISTINCT(normalised_name) AS name
      FROM `"
.$config_databaseTablePrefix."products`
      WHERE name LIKE '"
.database_safe($_GET["q"])."%' LIMIT 5
      "
;
    if (!
database_querySelect($sql,$products))
    {
      
$sql "SELECT DISTINCT(normalised_name) AS name
        FROM `"
.$config_databaseTablePrefix."products`
        WHERE name LIKE '%"
.database_safe($_GET["q"])."%' LIMIT 5";
      
database_querySelect($sql,$products);
    }
    print 
json_encode(array("totalResultsCount"=>count($products),"products"=>$products));
  }
  exit();
?>

i have replace the html/searchform.php with the following code:

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<script type='text/JavaScript'>
  $(function() {
  $( "#q" ).autocomplete({
    source: function( request, response ) {
      $.ajax({
        url: "<?php print $config_baseHREF?>searchJSON.php",dataType:"json",data:{q:request.term},
        success: function( data ) {
          response($.map( data.products, function( item ) { return { label:item.name, value:item.name}
          }));
        }
      });
      },
      minLength: 2,
      open: function() { $( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" ); },
      close: function() { $( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" ); }
    })
    .keydown(function(e){ if (e.keyCode === 13) { $("#search").trigger('submit'); }
    });
  });
</script>
<div class='searchform'>
  <form id='search' name='search' action='<?php print $config_baseHREF ?>search.php'>
    <div class="ui-widget">
      <input id='q' name='q' size='30'/>
      <input type='submit' value='<?php print translate("Search"); ?>' />
    </div>
  </form>
</div>

And i have enabled the javascripts in config.php
$config_useJavaScript = TRUE;

I have import from CVS some products but when i type into search no auto complete function work.

Version: 14/06A

Thanks,
D.Tzortzis

Submitted by support on Sat, 2014-09-06 15:26

Hi D.Tzortzis and welcome to the forum!

It may be a jQuery conflict as the 14/06A template already includes jQuery. First, edit your html/footer.php and DELETE the following code from line 5:

  <script src='<?php print $config_baseHREF?>html/vendor/jquery.min.js'></script>

Then, from your modification to html/searchform.php, remove the following lines:

  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>

...and instead, place them in html/header.php, just before the closing </head> tag.

That should be all it is, but if still no joy, let me know the installation URL (I'll remove before publishing your reply) and I'll check it out for you...

Cheers,
David.
--
PriceTapestry.com

Submitted by bird on Mon, 2014-09-22 12:07

Hi David,

could you please provide a solution for version 14/06A as code, classes and layout have changed and the solution mentioned above doesn't seem to work.

Thank you and best regards!

Submitted by support on Mon, 2014-09-22 14:26

Hi bird,

Here's the auto-complete html/searchform.php for 14/06A. Notice that the line to include jQuery itself has been removed as this is already included in the new template. However, it must be moved from being included in html/footer.php to html/header.php - please see this comment for full details of that change, otherwise that should be all it is...

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<script type='text/JavaScript'>
  $(function() {
  $( "#q" ).autocomplete({
    source: function( request, response ) {
      $.ajax({
        url: "<?php print $config_baseHREF?>searchJSON.php",dataType:"json",data:{q:request.term},
        success: function( data ) {
          response($.map( data.products, function( item ) { return { label:item.name, value:item.name}
          }));
        }
      });
      },
      minLength: 2,
      open: function() { $( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" ); },
      close: function() { $( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" ); }
    })
    .keydown(function(e){ if (e.keyCode === 13) { $("#search").trigger('submit'); }
    });
  });
</script>
<div class='pt_sf'>
  <div class='row'>
    <div class='medium-6 <?php print (isset($searchform["centered"])?"medium-centered":""); ?> columns'>
      <form id='search' name='search' action='<?php print $config_baseHREF ?>search.php'>
          <div class="row collapse">
            <div class="small-10 columns">
              <input required="required" type="text" id="q" name="q" value="<?php print (isset($q)?$q:""); ?>">
            </div>
            <div class="small-2 columns">
              <button class="button tiny postfix"><?php print translate("Search"); ?></button>
            </div>
          </div>
          <div class="row collapse">
            <div class="small-12 columns">
            <?php print translate("Search or browse by"); ?>
            <a href='<?php print $config_baseHREF.($config_useRewrite?"merchant/":"merchants.php"); ?>'><?php print translate("merchant"); ?></a>,
            <a href='<?php print $config_baseHREF.($config_useRewrite?"category/":"categories.php"); ?>'><?php print translate("category"); ?></a>
            <?php print translate("or"); ?>
            <a href='<?php print $config_baseHREF.($config_useRewrite?"brand/":"brands.php"); ?>'><?php print translate("brand"); ?></a>
            </div>
          </div>
      </form>
    </div>
  </div>
</div>

Cheers,
David.
--
PriceTapestry.com

Submitted by bird on Thu, 2014-10-09 14:38

Hi David,

unfortunately this doesn't work for me. I put the following lines in the header:

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src='<?php print $config_baseHREF?>html/vendor/jquery.min.js'></script>

and these two lines in the searchform.php (as provided)

<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />

I even tried different variations and put all 4 lines in the header.php.
$config_useJavaScript is set true.

Submitted by support on Thu, 2014-10-09 15:07

Hi,

It looks like you're already including jQuery in the header, so no need to add the second line - leave which may result in JavaScript errors due to the same library being included twice - if you revert your header to just:

  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>

...that should be all it is...

Cheers,
David.
--
PriceTapestry.com

Submitted by bird on Thu, 2014-10-09 15:40

My site looks like this:

header.php:

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>

searchform.php:

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>

footer:

<script src='<?php print $config_baseHREF?>html/vendor/foundation.min.js'></script>

But autocomplete doesn't work. Thanks for your patience!!!

Submitted by support on Fri, 2014-10-10 08:37

Hello Bernhard,

I've just tested on a clean installation of 14/06A with modifications to html/header.php and html/footer.php exactly as you described, and with the original searchJSON.php from the first post in this thread, and html/searchform.php from this comment and everything worked OK which sounds like what you have, so if you would like to email me your modified (and new)

searchJSON.php
html/header.php
html/searchform.php
html/footer.php

...I'll check out your exact files on my test server for you.

Cheers,
David.
--
PriceTapestry.com

Submitted by chrisst1 on Wed, 2014-11-05 10:00

Hi David

As you know I have multiple instalations was wondering if and how I could get a department select value from the same form and add it to the id in the url line in the script below. This would in theory allow the user to select department and then autocomplete/query the correct database.

Any suggestions would be great.

Chris

<script type="text/javascript">
$(function() {
  $( "#q" ).autocomplete({
    source: function( request, response ) {
      $.ajax({
        url: "<?php print $config_ptHREF."includes/searchJSON_local.php?id=".base64_encode($config_baseHREF); ?>",dataType:"json",data:{q:request.term},
        success: function( data ) {
          response($.map( data.products, function( item ) { return { label:item.name, value:item.name}
          }));
        }
      });
      },
      minLength: 2,
      open: function() { $( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" ); },
      close: function() { $( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" ); }
    })
    .keydown(function(e){ if (e.keyCode === 13) { $("#search-local").trigger('submit'); }
    });
});
</script>

<?php
  $id 
base64_decode($_GET['id']);
  require(
"/var/www/vhosts/#########/httpdocs".$id."includes/common.php");
  
header("Content-Type: application/json;");
  if (
$_GET["q"])
  {
    
$sql "SELECT DISTINCT(normalised_name) AS name
      FROM `"
.$config_databaseTablePrefix."products`
      WHERE name LIKE '"
.database_safe($_GET["q"])."%' LIMIT 5
      "
;
    if (!
database_querySelect($sql,$products))
    {
      
$sql "SELECT DISTINCT(normalised_name) AS name
        FROM `"
.$config_databaseTablePrefix."products`
        WHERE name LIKE '%"
.database_safe($_GET["q"])."%' LIMIT 5";
      
database_querySelect($sql,$products);
    }
    print 
json_encode(array("totalResultsCount"=>count($products),"products"=>$products));
  }
  exit();
?>

Submitted by support on Wed, 2014-11-05 11:09

Hi Chris,

In the usual multi-site set-up the value of the select box on the home page search form is the path to the installation, or close to it. Assuming it matches the sub-directory installation exactly, e.g. you have similar to the following:

<select name='site'>
  <option value='/electronics/'>Electronics</option>
  <option value='/home-and-garden/'>Home and Garden</option>
</select>

...then first of all, make sure that the select box also has an id attribute, e.g.

<select name='site' id='site'>
  <option value='/electronics/'>Electronics</option>
  <option value='/home-and-garden/'>Home and Garden</option>
</select>

With that in place, the line that generates the AJAX request URL:

url: "<?php print $config_ptHREF."includes/searchJSON_local.php?id=".base64_encode($config_baseHREF); ?>",dataType:"json",data:{q:request.term},

...can be modified to use the value of the site select box instead of $config_ptHREF, for example:

url: $("#site").val()+"<?php print "includes/searchJSON_local.php?id=".base64_encode($config_baseHREF); ?>",dataType:"json",data:{q:request.term},

If your site search form is set-up in such a way that the value is only the subdirectory name without leading or tailing forward-slash characters, then these can simply be inserted directly into the URL construction, e.g;

url: "/"+$("#site").val()+"/<?php print "includes/searchJSON_local.php?id=".base64_encode($config_baseHREF); ?>",dataType:"json",data:{q:request.term},

Hope this helps!

Cheers,
David.
--
PriceTapestry.com

Submitted by chrisst1 on Tue, 2014-11-18 20:24

Hi David

Super duper, moved things about a bit for my setup and it works a treat.

Thankyou David

Submitted by bodybuildingcom... on Sat, 2016-09-10 10:20

Hi David,

I am wondering if it is possible to increase the number of products shown in the dropdown when I am typing in a product/brand in the search form? At the moment, it's around 4 or 5 items that are shown from a particular brand/product from the autosearch.

For example, when I type 'USP' or 'USP Labs' which as a fairly big nutrition company, I only get approx 4 or 5 matches, but I have at least 20-30 products from them.

This is also the same for many other brand manufacturers.

Thanks.

Norbert

Submitted by support on Sat, 2016-09-10 11:00

Hello Norbert,

In searchJSON.php, you'll find the LIMIT clause for the SQL statements that select the products at lines 8 and 14:

LIMIT 5

...change the constant 5 in each case as required for more results.

Cheers,
David.
--
PriceTapestry.com

Submitted by bodybuildingcom... on Sat, 2016-09-10 17:12

Thanks David.

Much appreciate your help. Worked like a charm.

Norbert

Submitted by philstone on Thu, 2017-06-29 13:28

Hi David

Working on autocomplete at the minute, I was wondering is it possible that matching ean, mpn or model fields could show up in the search form autocomplete as well as product names (based on closest match to word being typed in) and if they do they forward to the product page for that item?

Also does autocomplete only fill in the search form in the order the words appear in the product name?

Thanks

Phil

Submitted by support on Thu, 2017-06-29 15:41

Hi Phil,

For performance reasons I would suggest only extending the search to `ean`, `mpn` and `model` fields (in keyword order) if the first query (product name from start, which can use an index direct hit and therefore no full index or table scan required) returns no results. To do this, where the original searchJSON.php has the following code at line 14:

        WHERE name LIKE '%".database_safe($_GET["q"])."%' LIMIT 5";

...REPLACE with;

        WHERE
          name LIKE '%".database_safe($_GET["q"])."%'
          OR
          ean LIKE '%".database_safe($_GET["q"])."%'
          OR
          mpn LIKE '%".database_safe($_GET["q"])."%'
          OR
          model LIKE '%".database_safe($_GET["q"])."%'
        LIMIT 5";

Hope this helps!

Cheers,
David.
--
PriceTapestry.com

Submitted by marco.saiu on Tue, 2018-01-23 12:29

Hello David,

i try to change autocomplete for work with multi installation setup

i need change form to send query on appropriate subdirectory.

Have idea how to change form from original AutoComplete script? I paste my code:

{code saved}

At the moment search autocomplete work but form not change pathname i think i need change

action='<?php print $config_baseHREF ?>search.php'

with site select path...

Thanks,
Marco Saiu

Submitted by support on Tue, 2018-01-23 14:24

Hi Marco,

You can change the action attribute of the #search form when the #site select box changes - so where you have:

<select name='site' id='site'>

...have a go with:

<select name='site' id='site' onChange='$("#search").attr("action",this.value+"search.php");'>

Hope this helps!

Cheers,
David.
--
PriceTapestry.com

Submitted by bodybuildingcom... on Sun, 2019-12-08 00:32

Hi David,

I have reinstalled the search auto complete mod, but when I start typing for example 'protein', in the search form, the drop down appears all the way on the left of the browser, instead of beneath the search results.

Could you please tell me where I can change this?

Thanks.

Norbert

Submitted by support on Mon, 2019-12-09 10:47

Hello Norbert,

I've updated the autocomplete download to include the latest jquery-ui / jquery (in html/vendor), please could you try with these versions uploaded - I needed to apply this on one site I was working on but not entirely sure why as nothing else changed..!

Cheers,
David.
--
PriceTapestry.com