help needed with javascript, ajax n jquery

Archived from the original Sajha.com — preserved as posted, replies can no longer be added here.
Start a New Discussion
Archived Post

Tech gurus i need some help. I am adding a predictive search( for products) to an  e-commerce cms website(just like in google search). Since its a cms, i am limited to use javascript only. the CMS has provided me the API which give me list of products. How can i achieve the task? this is how I am thinking of achieving the task: 1 using Ajax get the products via api. and store to a variable( product properties: name, id, company, etc) 2.when user type something in textbox, use jquery.autocomplete property to get value from the variable. this is how i think i am suppose to do, but i am not able to write code for it. any help is appreciated.

quicksiler · May 29, 2013 1:49 PM · 16,798 views

7 Replies

 What  exactly you need ? Jquery plugin  Markup CSS  Jquery code if you have plugin  $(document).ready(function() {          $("#ctl00_ContentPlaceHolder1_txtSerach").autocomplete('AutoCompleteHandler.ashx'); }); Here in my case I am using asp.net handler to return the data. You can use your API Hope it helps you.  

hardic · May 29, 2013 2:10 PM

1. looking for  codes that creates a variable which holds ajax get request (list of products from the api  (i can give u the api if needed)) 2. codes for autocompletehandler deadline aayera kei garnai aayena :(

quicksiler · May 29, 2013 3:19 PM

Dont' know Ajax, but googled and found below http://jqueryui.com/autocomple... your products in an array once you get it using API, and follow the code below <!doctype html> <html lang="en"> <head> <meta charset="utf-8" /> <title>jQuery UI Autocomplete - Default functionality</title> <link rel="stylesheet" href="http://code.jquery.com/ui/1.10... /> <script src="http://code.jquery.com/jquery-... <script src="http://code.jquery.com/ui/1.10... <link rel="stylesheet" href="/resources/demos/style.css" /> <script> $(funct

prankster · May 29, 2013 4:21 PM

To get the array of products i need to do ajax call to the api and i am stuck in ajax calls. Thru fiddler i can get into products (w properties: id name description etc) but by writing codes i am not able do so.

quicksiler · May 29, 2013 6:04 PM

  If i correctly understood you, this what you want to do :   1. You want  query your api (provided by cms) and add the response( list of products data) into a javascript variable. 2. Whenever user types something you want to do auto compelete.   This is just a template code, please change it as per your need.   As  I don't know anything about your cms api, I am assuming a lot of things here.. If i am not correct, provide more info:   1) Your CMS API location     -- Assuming that your CMS api is a restful service that prvoides  JSON data as response. I.e. The CMS API will look like this   http://www.timikatiramri.com/c... (this is the api location which will provide the data in an array format, again, these are assumptions, if its not the case provide more info on it)   - the above URL returns array data. i.e the response data would be    [ "Product Name A", "Product Name B", "Product Name c", "Product Name D" ]     I am assuming that you know how to use jquery ajax method and autcomplete property from jquery ui. If not then let us know.   <input id="products" type="text"/>   <script>   $(function(){   //variable to store product data   var myProductData = "";   //call the api method via ajax $.ajax({   url : 'http://www.timikatiramri.com/c... success:function(responsedata,status,xhr){ //assign the response data into a javascript variable myProductData = responsedata; }});   //now bind our input text to handle autocompelete $('#products').autocomplete({source:myProductData });   }); </script>     That's all you need if you api is returning data in array format. if not then you need to modify it as per your need. As I said I don't know how data is coming from api, this is the best I Can came with. Please provide more info and we will let you know more about it.   HAPPY CODING :)      

namit_thapa · May 29, 2013 6:22 PM

 I made a fiddle for you. as you type in the text box the product list will appear. however the ajax will not work ,as ajax is not allowed on cross domain model. take that as an example. here is the js fiddle link. http://jsfiddle.net/gMf5L/3/ Good luck.

namit_thapa · May 29, 2013 6:47 PM

 use jsonp for cross domain issues !

Ayus · May 29, 2013 10:19 PM

This conversation is preserved exactly as it was on the original Sajha.com and can't accept new replies.

Start a New Discussion

You might be interested in...

Recent Classifieds View all
Upcoming Events View all
Service Providers View all