Jump to content
dev osCommerce
Forum
  • Checkout
  • Login
  • Contact Us
  • Get in touch

osCommerce

The e-commerce.

New Demo
Our Partners

AJAX search suggest - using the keyboard

lukasz85

By lukasz85
in General Support

Recommended Posts

lukasz85

lukasz85

Posted
Posted

Hi,

 

AJAX search suggest

http://addons.oscommerce.com/info/4144

 

 

Does not support the arrow up and down the keyboard. Can only be a mouse. Help someone?

 

searchsuggest.php

include('includes/application_top.php');
///Make sure that a value was sent.
   if (isset($_GET['keywords']) && $_GET['keywords'] != '') {
   //Add slashes to any quotes to avoid SQL problems.
   $search = addslashes($_GET['keywords']);
   //Get every page title for the site.
      // $sql = "SELECT * FROM products_description join products on products_description.products_id=products.products_id WHERE products.products_status=1 AND products.products_carrot=0 and products.products_id = products_description.products_id and products_description.language_id = '" . (int)$languages_id . "' and products_description.products_name like('%" . tep_db_input($_GET['search']) . "%') LIMIT 15";
      $sql = "select pd.products_name, p.products_id from " . TABLE_PRODUCTS_DESCRIPTION . " pd left join " . TABLE_PRODUCTS . " p on pd.products_id = p.products_id WHERE p.products_status = '1' and p.products_id = pd.products_id and pd.language_id = '" . (int)$languages_id . "' and pd.products_name like('%" . tep_db_input($_GET['keywords']) . "%') LIMIT 13";

/**
* Set XML HTTP Header for ajax response
*/
header('Content-Type: text/xml;');
header('Cache-Control: no-cache;');
echo '<?xml version="1.0" encoding="utf-8" ?>' . "\n";

echo '<response>' . "\n";
echo ' <suggestlist>' . "\n";
      $product_query = tep_db_query($sql);
   while($product_array = tep_db_fetch_array($product_query)) {
          //$product_array['products_name'] = htmlentities($product_array['products_name']);
	 //echo '<a href="' . tep_href_link('product_info.php', 'products_id=' . $product_array['products_id']) . '">' . $product_array['products_name'] . '</a>' . "\n";
                echo '<item>' . "\n";
                echo ' <name><![CDATA[' . $product_array['products_name'] . ']]></name>' . "\n";
                echo ' <url><![CDATA[' . tep_href_link('product_info.php', 'products_id=' . $product_array['products_id']) . ']]></url>' . "\n";
                echo '</item>' . "\n";
   }
  }
echo ' </suggestlist>' . "\n";
echo '</response>' . "\n";

include('includes/application_bottom.php');

 

search_suggest.xsl

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD Xhtml 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output encoding="utf-8" indent="no" method="html" doctype-public="-//W3C//DTD Xhtml 1.0 Transitional//EN" doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"/>
<xsl:template match="/">
<xsl:for-each select="response/suggestlist/item">
<div align="left" style="
cursor: pointer; 
width: 300px; 
opacity: 0.6; 
filter: alpha(opacity=60); 
background-color: #E9E9E9; 
padding: 4px; 
margin: 2px;
color:#000000; 
font-size: 7pt; 
font-family: Verdana;" 

onclick="window.location.href = '{url}';" 
onmouseover="this.style.backgroundColor = '#A3A3A3'; this.style.color = '#E9E9E9';" 
onmouseout="this.style.backgroundColor = '#E9E9E9'; this.style.color = '#000000';">

<xsl:value-of select="name"/>
</div>
</xsl:for-each>
</xsl:template>
</xsl:stylesheet>

 

class.OSCFieldSuggestjs

function OSCFieldSuggest(id, file_layout, file_data) {
 base = this;
 base.FILE_XSLT_LAYOUT = file_layout;
 base.FILE_XML_DATA = file_data;
 base._OBJ = document.getElementById(id);
 if(base._OBJ) {
   //define the functions..
   base.createXmlHttpRequest = function() {
     var requestInstance = false;
     if (window.XMLHttpRequest) { //FE
       requestInstance = new XMLHttpRequest();
       if (requestInstance.overrideMimeType) {
         requestInstance.overrideMimeType('text/xml');
       }
     } else if (window.ActiveXObject) { // IE
       try {
         requestInstance = new ActiveXObject("Msxml2.XMLHTTP");
       } catch (e) {
         try { //last chance..
           requestInstance = new ActiveXObject("Microsoft.XMLHTTP");
         } catch (e) {}
       }
     }
     if(!requestInstance) {
       alert("Sorry, your browser don't support a little bit AJAX");
     }
     return(requestInstance);
   };
   base.loadDocument = function(file, funcAfterDocumentLoaded) {
     var myRequest = base.createXmlHttpRequest();
     myRequest.open('GET', file, true);
     myRequest.onreadystatechange = function(e) {
       if(myRequest.readyState == 4 && myRequest.status == 200) {
         funcAfterDocumentLoaded(myRequest);
       } else if(myRequest.readyState == 4) {
         //error file isn't loaded..
         //alert("Sorry, the file " + file + " couldn't loaded!");
       }
     };
     myRequest.send(null);
   };
   base.parseXmlDocument = function(xsltLayout, xmlData) {
     if(document.all) {
       return(xmlData.transformNode(xsltLayout));
     } else {
       var processor = new XSLTProcessor();
       processor.importStylesheet(xsltLayout);
       var result = processor.transformToDocument(xmlData);
       var xmls = new XMLSerializer();
       return(xmls.serializeToString(result));
     }
   };
   base.getDocumentOffsetTop = function(obj) {
     return(parseInt(obj.offsetTop) + ((obj.offsetParent) ? base.getDocumentOffsetTop(obj.offsetParent) : 0));
   };
   base.getDocumentOffsetLeft = function(obj) {
     return(parseInt(obj.offsetLeft) + ((obj.offsetParent) ? base.getDocumentOffsetLeft(obj.offsetParent) : 0));
   };
   base.show = function() {
     base._OBJ_panel.style.visibility = 'visible';
   };
   base.hide = function() {
     base._OBJ_panel.style.visibility = 'hidden';
   };
   base.suggestList = function() {
     base.loadDocument(base.FILE_XML_DATA + "?" + base._OBJ.name + "=" + base._OBJ.value, function(request) {
       base._OBJ_panel.innerHTML = base.parseXmlDocument(base._xsltSheet, request.responseXML);
       base._OBJ_panel.style.top = (base.getDocumentOffsetTop(base._OBJ) + base._OBJ.offsetHeight) + "px";
       base._OBJ_panel.style.left = base.getDocumentOffsetLeft(base._OBJ) + "px";
       base.show();
     });
   };
   //load xslt layout
   base.loadDocument(base.FILE_XSLT_LAYOUT, function(request) {
     base._xsltSheet = request.responseXML;
   });
   //create html panel to show
   base._OBJ_panel = document.createElement('div');
   base._OBJ_panel.style.visibility = 'hidden';
   base._OBJ_panel.style.position = 'absolute';
   base._OBJ_panel.style.overflow = 'hidden';
   base._OBJ_panel.style.height = 'auto';
   base._OBJ_panel.style.border = '1px solid #CCCCCC';
base._OBJ_panel.style.background = '#E9E9E9';
//base._OBJ_panel.style.background = '#E9E9E9';
   base._OBJ_panel.style.top = 0 + "px";
   base._OBJ_panel.style.left = 0 + "px";
   base._OBJ.parentNode.appendChild(base._OBJ_panel);
   //set the events
   base._OBJ.onkeyup = function(e) {
     if(base._OBJ.value.length > 0) {
       base.suggestList();
     }
   };
   base._OBJ.onblur = function(e) { //lost focus
     //waiting a few milli sec. .. before hide the clicked panel ;)
     setTimeout(function() {
       base.hide();
     }, 500);
   };
   base._OBJ.onfocus = function(e) { //got focus
this.value='';
     if(base._OBJ.value.length > 0) {
       base.suggestList();
     }
   };
 } else {
   //no field found..
   //alert("Field with ID " + id + " couldn't found!");
 }
};

Link to comment
Share on other sites
  • 8 months later...
Dax87

Dax87

Posted
Posted

how do insert to image at product ?

 

code original:

 

<?php
/*
This is the back-end PHP file for the osCommerce AJAX Search Suggest

You may use this code in your own projects as long as this
copyright is left	in place.  All code is provided AS-IS.
This code is distributed in the hope that it will be useful,
	but WITHOUT ANY WARRANTY; without even the implied warranty of
	MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.

The complete tutorial on how this works can be found at:
http://www.dynamicajax.com/fr/AJAX_Suggest_Tutorial-271_290_312.html

For more AJAX code and tutorials visit http://www.DynamicAJAX.com
For more osCommerce related tutorials and code examples visit http://www.osCommerce-SSL.com

Copyright 2006 Ryan Smith / 345 Technical / 345 Group.
*/
include('includes/application_top.php');
   $sql = "SELECT * FROM products_description join products on products_description.products_id=products.products_id WHERE products.products_status=1 AND products_description.products_name like('%" . tep_db_input($_GET['search']) . "%') LIMIT 10";
   $product_query = tep_db_query($sql);
while($product_array = tep_db_fetch_array($product_query)) {
	echo '<a href="' . tep_href_link('product_info.php', 'products_id=' . $product_array['products_id']) . '">' . $product_array['products_name'] . '</a>' . "\n";
}
?>

 

after:

echo '<a href="' . tep_href_link('product_info.php', 'products_id=' . $product_array['products_id']) . '">' . $product_array['products_name'] . '</a>' . "\n";

 

insert:

echo tep_image(DIR_WS_IMAGES . $products['products_image'], $products['products_name']);

 

but does not work, image error :(

 

how do?

ex: search of facebook: image and next the name.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

Go to topic listing
×
×
  • Create New...