JavaScript - Autosuggest Array Search
I want to have a simple code such that some data is stored in array. When we create a search box it has to give suggestions from the data stored in array.
Similar TutorialsHi there...I have an autosuggest that I got from a friend. My question is ... the autosuggest works well on my business textbox - what would the code look like to get it to work on the region textbox (or how do I get it to work on more than one textbox - can I just make a copy of the js file and change stuff)... Here is the html code for the index.html page with two boxes and a submit button... Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Welcome</title> <link href="searchfield.css" rel="stylesheet" type="text/css" media="screen" /> <script type="text/javascript" src="searchfield1.js"></script> </head> <body> <form name="searchresults" action="Site/searchresults2.php" method="post" > <input name="Business" class="textfield_effect" type="text" value="Enter Business Type or Name" size="30" onfocus="if(this.value==this.defaultValue) this.value='';" autocomplete="off" id="businessquery" /> <input name="Region" class="textfield_effect" type="text" value="Enter Suburb or Postcode" size="30" onfocus="if(this.value==this.defaultValue) this.value='';" autocomplete="off" id="regionquery" /> <input type="submit" class="textfield_button" value="Search"/> </body> </html> and here is the code for the file called searchfield1.js that powers the autosuggest... Code: this.searchfield = function(){ // CONFIG # // this is id of the search field you want to add this script to. // You can use your own id just make sure that it matches the search field in your html file. var id = "businessquery"; // Text you want to set as a default value of your search field. var defaultText = "Enter Business Type or Name!"; // set to either true or false // when set to true it will generate search suggestions list for search field based on content of variable below var suggestion = true; // static list of suggestion options, separated by comma // replace with your own var suggestionText = "Accounting Firm, Independent Actors, Administration of Public Programs, above the fold, absolute link, accessibility, address bar, affordance, alt text, alt tag, anchor, animated GIF, anti-alias, applet, assumed knowledge, authoring, automagically, autoresponder, back end/front end, backup, bandwidth, banner ad, banner blindness, belt-and-suspenders, bitmap, blog, blogger, blogging, bookmark, breadcrumb, broadband, browser, cache, cached files, call to action, Cascading Style Sheets , chatroom, chrome, click-through rate, client-side/server-side, closure, compatibility mode, data compression, content management system , contextual menu, convergence, cookie, cost-per-clickthrough, cost-per-thousand, crawler, cross-browser compatibility, cybersquatter, deep-linking, default, degrade gracefully, deprecated, design pattern, directory, disjointed rollover, dither, div, div-i-tis, divitis, document type declaration, doctype, document type definition, Domain Name System, DNS server, domain name, DomaiNZ, doorway/gateway page, dots-per-inch, download, Dublin Core metadata, dynamic HTML, e-commerce, email, element, encryption, favicon.ico, File Transfer Protocol, FTP client, firewall, Fireworks, Flash, Flash Generator, flow chart, fold, above-the-fold, footer navigation, form, folksonomy, frame, frameset, front end/back end, gateway page, global navigation, granularity, Graphic Interchange Format, Graphical User Interface, hack, handle, haptics, hexadecimal colours, hits, host, hosting, hotspot, HyperText Markup Language, HyperText Transfer Protocol, HTML markup, HTML-text, hyperlink, iframes, i-mode, image map, impression, include, information architecture, information foraging, initialism, integration, interactive television, interface, internet, interstitial, intranet, Initial Public Offering, Internet Protocol, IP address, IP number, Internet Service Provider, JavaScript, Joint Photographers Expert Group, label, landing page, legacy content, link: absolute, relative, root, link farm, link rot, definition, ordered, unordered, listserv, logfiles, logfile analysis, look-and-feel, lossless compression, lossy compression, macron, mailing lists, markup, meta element, metadata, meta tag, mine-sweeping, MP3, MySQL, natural language, navigation, open source, optimise, optimisation, opt-in/opt-out, PageRank (PR), parasite economy, design pattern, perceived affordance, permission-based marketing, phishing, PHP: Hypertext Preprocessor, Portable Document Format, web portal, Pretty Good Privacy, pixel, plug-in, pop-up window, pop-under, Portable Network Graphic, prosumer, QuickTime, quirks mode, reciprocal links, referrer, referrer log, Really Simple Syndication, relative link, Realtime Transport Protocol, robot, robots file, robots.txt, rollover, disjointed rollover, root, root directory, root link, scan, scanning, schematic, SCM, SCP, search engine, search engine marketing, search engine optimisation, Section 508, Secure Sockets Certificate, semantic markup, server, sever-side/client-side, server-side include, session, session tracking, Shockwave, shopping-cart, shortcut icon, Simple Object Access Protocol, site feed, sitemap, smart tags, Synchronised Multimedia Integration Language, sniffer, spam, spim, spider, splash page, splash screen, spyware, standardista, standards-compliant/strict mode, status bar, sticky, streaming, streaming media, structured query language, stylesheet, system font, tags, tags/tagging, target, template, top-level navigation, topic path, traffic, transform gracefully, transparent GIF, trackback, typosquatter, Unicode, Unicode Transformation Format, Unified Modeling Language, Uniform Resource Identifier, Uniform Resource Locator, uploading, usability, user session, code standards, form input, vector, vector-based file, version control, viral marketing, virus, visual editor, web, Web 2.0, web accessibility, web-authoring, web browser, web font, typeface, web-log, web server logs, websafe colours, palette, web standards, WebTV, what-you-see-is-what-you-get, wireframe, Wireless Application Protocol, Wireless Markup Language, Worldwide Web, eXtensible Markup Language, XML schema"; // END CONFIG (do not edit below this line, well unless you really, really want to change something :) ) // Peace, // Alen var field = document.getElementById(id); var classInactive = "sf_inactive"; var classActive = "sf_active"; var classText = "sf_text"; var classSuggestion = "sf_suggestion"; this.safari = ((parseInt(navigator.productSub)>=20020000)&&(navigator.vendor.indexOf("Apple Computer")!=-1)); if(field && !safari){ field.value = defaultText; field.c = field.className; field.className = field.c + " " + classInactive; field.onfocus = function(){ this.className = this.c + " " + classActive; this.value = (this.value == "" || this.value == defaultText) ? "" : this.value; }; field.onblur = function(){ this.className = (this.value != "" && this.value != defaultText) ? this.c + " " + classText : this.c + " " + classInactive; this.value = (this.value != "" && this.value != defaultText) ? this.value : defaultText; clearList(); }; if (suggestion){ var selectedIndex = 0; field.setAttribute("autocomplete", "off"); var div = document.createElement("div"); var list = document.createElement("ul"); list.style.display = "none"; div.className = classSuggestion; list.style.width = field.offsetWidth + "px"; div.appendChild(list); field.parentNode.appendChild(div); field.onkeypress = function(e){ var key = getKeyCode(e); if(key == 13){ // enter selectList(); selectedIndex = 0; return false; }; }; field.onkeyup = function(e){ var key = getKeyCode(e); switch(key){ case 13: return false; break; case 27: // esc field.value = ""; selectedIndex = 0; clearList(); break; case 38: // up navList("up"); break; case 40: // down navList("down"); break; default: startList(); break; }; }; this.startList = function(){ var arr = getListItems(field.value); if(field.value.length > 0){ createList(arr); } else { clearList(); }; }; this.getListItems = function(value){ var arr = new Array(); var src = suggestionText; var src = src.replace(/, /g, ","); var arrSrc = src.split(","); for(i=0;i<arrSrc.length;i++){ if(arrSrc[i].indexOf(value.toLowerCase()) >= 0){ arr.push(arrSrc[i]); }; }; return arr; }; this.createList = function(arr){ resetList(); if(arr.length > 0) { for(i=0;i<arr.length;i++){ li = document.createElement("li"); a = document.createElement("a"); a.href = "javascript:void(0);"; a.i = i+1; a.innerHTML = arr[i]; li.i = i+1; li.onmouseover = function(){ navListItem(this.i); }; a.onmousedown = function(){ selectedIndex = this.i; selectList(this.i); return false; }; li.appendChild(a); list.setAttribute("tabindex", "-1"); list.appendChild(li); }; list.style.display = "block"; } else { clearList(); }; }; this.resetList = function(){ var li = list.getElementsByTagName("li"); var len = li.length; for(var i=0;i<len;i++){ list.removeChild(li[0]); }; }; this.navList = function(dir){ selectedIndex += (dir == "down") ? 1 : -1; li = list.getElementsByTagName("li"); if (selectedIndex < 1) selectedIndex = li.length; if (selectedIndex > li.length) selectedIndex = 1; navListItem(selectedIndex); }; this.navListItem = function(index){ selectedIndex = index; li = list.getElementsByTagName("li"); for(var i=0;i<li.length;i++){ li[i].className = (i==(selectedIndex-1)) ? "selected" : ""; }; }; this.selectList = function(){ li = list.getElementsByTagName("li"); a = li[selectedIndex-1].getElementsByTagName("a")[0]; field.value = a.innerHTML; clearList(); }; }; }; this.clearList = function(){ if(list){ list.style.display = "none"; selectedIndex = 0; }; }; this.getKeyCode = function(e){ var code; if (!e) var e = window.event; if (e.keyCode) code = e.keyCode; return code; }; }; // script initiates on page load. this.addEvent = function(obj,type,fn){ if(obj.attachEvent){ obj['e'+type+fn] = fn; obj[type+fn] = function(){obj['e'+type+fn](window.event );} obj.attachEvent('on'+type, obj[type+fn]); } else { obj.addEventListener(type,fn,false); }; }; addEvent(window,"load",searchfield); And here is the code for the CSS file called searchfield.css Code: /* default (inactive field) */ .sf_inactive{ border:thin solid #CCCCCC; background:#ffffff; color:#666666; font-style: 0; } /* on focus (when field is clicked on) */ .sf_active{ border:2px solid #CCCCCC; background:#fff; color:#666666; } /* with text (when field is inactive but contains user's input) */ .sf_text{ border:2px solid #CCCCCC; background:#fff; color:#888; } /* suggestions box */ /* js code generates unordered list */ .sf_suggestion{ position:relative; } .sf_suggestion ul{ position:absolute; margin:0; padding:0; top:0; left:0; background-color: #FFFFFF; } .sf_suggestion li{ margin:0; padding:0; list-style:none; } .sf_suggestion li a{ display:block; text-indent:5px; color:#666666; } .sf_suggestion li.selected a{ color: #FFFFFF; background-color: #666666; } Many thanks for hints, suggestions and contributions Hi All, i have an autosuggest function which i am trying to make the textbox value to change to the represent the value of the highlighted auto suggestion. i am trying to do this so that when i submit the form the correct value is passed to the next page where as at the moment only the text which is typed in the textbox is passed. here is my index.php PHP Code: <?php include("config.php");?> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> Ajax Auto Suggest </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> <link href="css/style.css" rel="stylesheet" type="text/css"> <!--[if gte IE 6]> <link rel="stylesheet" type="text/css" href="i_hate_IE.css" /> <![endif]--> <SCRIPT LANGUAGE="JavaScript" src="js/jquery.js"></SCRIPT> <SCRIPT LANGUAGE="JavaScript" src="js/script.js"></SCRIPT> <script type="text/javascript"> window.onload = function() { document.getElementById('keyword').setAttribute('autocomplete','off'); } </script> </HEAD> <BODY> <center> <div class="main"> <form id="test" name="form1" method="post" action="search.php"> <input type="hidden" name="mode" id="mode" value="1"/> <div id="holder"> <input type="text" name="keyword" id="keyword" tabindex="0"><img src="images/loading.gif" id="loading"> </div> <div id="ajax_response"></div> </form> </div> </center> </BODY> </HTML> here is my search.php PHP Code: <?php include("config.php"); $keyword = $_POST['keyword']; $sql = "select storeName,storeLink from ".$db_table." where ".$db_column." like '".$keyword."%' limit 0,1"; $result = mysql_query($sql) or die(mysql_error()); if(mysql_num_rows($result)) { #echo '<ul class="list">'; while($row = mysql_fetch_array($result)) { $link = $row['storeLink']; header('Location: '.$link.''); } } ?> and here is my script.js file Code: $(document).ready(function(){ $(document).click(function(){ $("#ajax_response").fadeOut('slow'); }); $("#keyword").focus(); var offset = $("#keyword").offset(); var width = $("#keyword").width()-2; $("#ajax_response").css("left",offset.left); $("#ajax_response").css("width",width); $("#keyword").keyup(function(event){ //alert(event.keyCode); var keyword = $("#keyword").val(); if(keyword.length) { if(event.keyCode != 40 && event.keyCode != 38 && event.keyCode != 13) { $("#loading").css("visibility","visible"); $.ajax({ type: "POST", url: "ajax_server.php", data: "data="+keyword, success: function(msg){ if(msg != 0) $("#ajax_response").fadeIn("slow").html(msg); else { $("#ajax_response").fadeIn("slow"); $("#ajax_response").html('<div style="text-align:left;">No Matches Found</div>'); } $("#loading").css("visibility","hidden"); } }); } else { switch (event.keyCode) { case 40: { found = 0; $("li").each(function(){ if($(this).attr("class") == "selected") found = 1; }); if(found == 1) { var sel = $("li[class='selected']"); sel.next().addClass("selected"); sel.removeClass("selected"); } else $("li:first").addClass("selected"); } break; case 38: { found = 0; $("li").each(function(){ if($(this).attr("class") == "selected") found = 1; }); if(found == 1) { var sel = $("li[class='selected']"); sel.prev().addClass("selected"); sel.removeClass("selected"); } else $("li:last").addClass("selected"); } break; case 13: $("#ajax_response").fadeOut("slow"); $("#keyword").val($("li[class='selected'] a").text()); break; } } } else $("#ajax_response").fadeOut("slow"); }); $("#ajax_response").mouseover(function(){ $(this).find("li a:first-child").mouseover(function () { $(this).addClass("selected"); }); $(this).find("li a:first-child").mouseout(function () { $(this).removeClass("selected"); }); $(this).find("li a:first-child").click(function () { $("#keyword").val($(this).text()); $("#ajax_response").fadeOut("slow"); }); }); }); i'd really appreciate some help with this please... thanks Luke Hi Guys, i am wondering if there is a way to have an auto Complete form field from a db table data ? thanks I'm having major pains trying to figure this out. I'm kind of new to Javascript, I need to open a text file from an external server, store each line in an array, then search that array for a certain word (HIGH), and if it exists then write something to the webpage, and if not, write something else. Here is what I have so far: Code: <html> <head> <title>Test</title> <script> <!-- function test(x) { if (wxd1txt.readyState === 4 && wxd1txt.status === 200) { // Makes sure the document is ready to parse and Makes sure it's found the file. var wxd1text = wxd1txt.responseText; var wxd1array = wxd1txt.responseText.split("\n"); // Will separate each line into an array var wxd1high = wxd1array.toString(); //Converting the String content to String //var highsearchreg = new RegExp("HIGH"); //var wxd1high = wxd1array[x].search(highsearchreg); document.write(wxd1high); if (wxd1high.search("HIGH") >= 0){ document.write("HIGH RISK");} else { document.write("NO RISK");} } } //--> </script> </head> <body> Hi! <script> <!-- var Today = new Date(); var ThisDay = Today.getDate(); var ThisMonth = Today.getMonth()+1; var ThisYear = Today.getYear(); var Hour = Today.getHours(); var Day2 = Today.getDate()+1; var Day3 = Today.getDate()+2; if (navigator.appName != "Microsoft Internet Explorer") { ThisYear = ThisYear + 1900;} if (ThisMonth < 10) { ThisMonth = "0" + ThisMonth;} if (ThisDay < 10) { ThisDay = "0" + ThisDay;} if (Hour == 2 || Hour == 22 || Hour == 23 || Hour == 0 || Hour == 1) { var wxHourd1 = 0600} else if (Hour >= 3 && Hour <= 10) { var wxHourd1 = 1300;} else if (Hour >= 11 && Hour <= 13) { var wxHourd1 = 1630;} else if (Hour >= 14 && Hour <= 16) { var wxHourd1 = 2000;} else if (Hour >= 17 && Hour <= 21) { var wxHourd1 = 0100;} //var wxurld1 = "http://www.spc.noaa.gov/products/outlook/archive/"+ThisYear+"/KWNSPTSDY1_"+ThisYear+""+ThisMonth+""+ThisDay+""+wxHourd1+".txt"; var wxurld1 = "http://www.spc.noaa.gov/products/outlook/archive/2010/KWNSPTSDY1_201005101300.txt" //(High risk day for testing) //document.write(wxurld1); //Use this to verify this section is working if (window.XMLHttpRequest) { wxd1txt=new XMLHttpRequest(); } else // IE 5/6 { wxd1txt=new ActiveXObject("Microsoft.XMLHTTP"); } wxd1txt.open("GET", wxurld1, true); wxd1txt.onreadystatechange = test(); // --> </script> </body> </html> When added to a webpage, nothing shows up except the "Hi!" and there are no errors in the Javascript Console in Google Chrome. Is this possible with Javascript, and if so, what am I doing wrong or not doing? Also, I have 2 URLs, one is a text file that has the HIGH text I want for an example, the other is the current file, which shouldn't have HIGH in it (unless the weather in the US turns really bad) The question is Allow the search function to start anywhere within the name, rather than just at the start (so searching for "icha" would match "Richard". can any one help? Reply With Quote 01-14-2015, 05:08 PM #2 Philip M View Profile View Forum Posts Supreme Master coder! Join Date Jun 2002 Location London, England Posts 18,371 Thanks 204 Thanked 2,573 Times in 2,551 Posts Code: <script type = "text/javascript"> var names = ["Brian", "Peter", "Richard","Thomas"]; for (var i =0; i<names.length; i++) { var str = names[i]; var n = str.search(/icha/i); // the i flag means case insensitive if (n != -1) { // match found alert (i + " " + n); // 2 1 that is, the match is found at the third array item at the second character } } </script> Or:- Code: <script type = "text/javascript"> var names = ["Brian", "Peter", "Richard","Thomas"]; var pattern = "icha"; for (var i =0; i<names.length; i++) { var str = names[i]; var s = new RegExp(pattern,'i').test(str); // the i flag means case insensitive if (s) { alert ("Match found at array index " + i); // 2 } } </script> All advice is supplied packaged by intellectual weight, and not by volume. Contents may settle slightly in transit. Hello everybody I'm working on a tiny personal project, that only needs a little push to be finished. As I'm not a skilled enough scripter, I had to google around, but without any result exactly same as mine. What I'd like to know, how can I search in the body for strings surrounded by other strings that signs that the string I want is between them? example: Code: I'm a part of the body :3 // <- not surrounded part of the body [cust]You want me in your array :)[/cust] // <- this one is surrounded I won't get into your array :( // <- this one is not, just like the most of the body I have no snippet that could help me. Thank you in advance Hi Guys, I am trying to make a function that will search for a substring, in this case 'http://instagr.am/p/' within a text area on a form then add '[embed]' & '[/embed]' tags around it. I have currently got the following code Code: <script type='text/javascript'> function show_alert() { str = formname.elements['inputid'].value; arr = (str.split(' ') + '<br />'); jQuery.each(arr, function() { if (arr.indexOf('http://instagr.am/p/') >= 0) { alert('An http://instagr.am/p/ link has been found'); //alert('It is entry ... in the array'); //Then edit the entry } } ); } </script> This breaks the contents of the textarea (at spaces) into an array then finds any entries with 'http://instagr.am/p/' in them (could be 'http://instagr.am/p/29fdghHdv'). Once it has found any and all of these entries it will add an '[embed]' code to the beginning and an '[/embed]' tag at the end. Example... http://instagr.am/p/vuHdeyfa2 is converted to: '[embed]http://instagr.am/p/vuHdeyfa2[/embed]' Then the changes must reflected in the textarea input "formname.elements["textareaid"].value = editedstring; Thankyou for your assistance. I have the following code as shown below: Code: <html> <script type="text/javascript"> var all = []; var a = ["1234", "Jim", "Lab1", "5455"]; var b = ["1235", "Jack", "Lab1", "5459"]; var c = ["1236", "Jane", "Lab1", "5455"]; var d = ["1237", "June", "Lab1", "5458"]; var e = ["1238", "Jill", "Lab2", "5461"]; var f = ["1239", "John", "Lab2", "5462"]; var g = ["1240", "Jacab", "Lab3", "5465"]; all.push(a); all.push(b); all.push(c); all.push(d); all.push(e); all.push(f); all.push(g); for(var i=0; i<all.length; i++){ document.write(all[i] + "<br>"); } </script> </html> How to I get the unique & in order of column 4 given that column 3 is given. Example: If the user provide the value 'Lab1' for column 3, the Javascript will return me the following? Code: "Lab1", "5455" "Lab1", "5458" "Lab1", "5459" In this case, Let's take Google Search as example: The code is JScript .NET, which is basically a .NET version of Javascript. Regardless of language, Anyone with appending type of skill can answer my question. This code is used in Fiddler(It's a Man-in-the-middle proxy) Code: if (oSession.uriContains("&q=")) // oSession is a Fiddler object session // uriContains() function, checks for case-insensitive string from the URI { var str = oSession.fullUrl; var sAppend = "test1+test2+test3"; if (!oSession.uriContains(sAppend)) { oSession.fullUrl = str.replace( "&q=","&q="+sAppend); } } For those who are confused, It says, If &q= is present in the URI, replace/append &q= with &q=test1+test2+test3 Problem: It appends test1+test2+test3 instantly, when it sees &q= in the URL. Basically, how do I make it wait until I click the submit/search button Thank you. Update: I heard about Onsubmit() event, but not really familiar with it. How do I use it? like, should I go to google source page and edit the form id? Also, Any other methods besides Onsubmit()? Hi Everyone! I have a website that I'm designing where I have the need to search multiple sites at specific times. By this I mean that In some cases, we would want to search only the internet using google, or only search the site that I've created (which currently uses the jse_search.js solution), or only our company's website. I currently have four different search boxes that will search either the internet, the internal site, a separate internal site, or a third-party website, which all working fine. The problem is that the search boxes take up quite a bit of space, and the layout is becoming cumbersome. Is there a way in Javascript I could use a single search box and a drop-down list to select which method to use? The code I'm currently using is below. With the exception of the Google search function, I've modified some of the site names to general site names and paths to preserve the company's anonymity: Code in the <head> tag: Code: <script language="JavaScript1.3" type="text/javascript" src="jse_form.js"> </script> Code in the <body> tag: Code: <!--Begin Internal Site Search 1!--> <div> <p style="text-align: center;"> <table border="0" cellpadding="0"> <tr><td><form name="jse_Form" onsubmit="search_form(jse_Form);return false"> <input type="text" name="d" size="30"> </tr></td> <tr><td> <input type="button" value="Internal Site Search 1" onclick="search_form(jse_Form)"> </form> </tr></td> </table> <!--End Internal Site Search 1!--> <!--Begin Internal Site Search 2!--> <div> <p style="text-align: center;"> <table border="0" cellpadding="0"> <tr><td> <!--webbot bot="Search" S-Index="all" S-Fields S-Text="Search for:" I-Size="20" S-Submit="Start Search" S-Clear="Reset" S-TimestampFormat="%m/%d/%Y" TAG="BODY" b-useindexserver="1" startspan --> <form action="http://sitesearch2.idq" method="POST"><input type="text" name="UserRestriction" size="30" value> </tr></td> <tr><td style="text-align: center;"> <input type="submit" value="Internal Site Search 2"></form> </form> <!--webbot bot="Search" i-checksum="4210" endspan --> </td></tr> </table> </div> <!--End Internal Site Search!--> <!--Begin Google Search!--> <form method="get" action="http://www.google.com/search"> <div> <p style="text-align: center;"> <table border="0" cellpadding="0"> <tr><td> <input type="text" name="q" size="30" maxlength="233" value="" /> </tr></td> <tr><td align="center"> <input type="submit" value="Google Search" /></td></tr> </table> </div> </form> <!--End Google Search!--> <!--Begin Third Party Search!--> <form id="keywordSearchForm" method="get" action="http://www.site3.html"> <div> <p style="text-align: center;"> <table border="0" cellpadding="0"> <tr><td> <input class="input" type="text" name="keyword" size="30" /> </tr></td> <tr><td align="center"> <input type="hidden" name="origin" value="keywordsearch" /><input id="go" class="button" tabindex="0" type="submit" value="Third Party Search" /> </td></tr> </table> </div> </form> <!--End Third Party Site Search!--> Hi experts, is it possible via Javascript to search certain websites with certain keywords without having to use specific search engines? example search only the following: 1. www.yyy.com 2. www.aaa.com 3. www.zzz.com for the keyword "Laminat" and open the sites accordingly. thx Hello people. I'm looking to create a simple search engine capable of searching multiple search engines simultaneously together (e.g. Google, Bing, Yahoo, etc.) and then displaying the results below for all sites on the same page. I don't want each search engine results page opening up in individual windows or anything, nor do I want people to have to manually select the search engine to search with. Just a single page where a user types in something, pressed [Enter] and then presented with all results from multiple sites on one page (without duplicates). I'm also looking to do this with image and torrent sites, etc. How would I go about doing this? Thanks a million guys. You have bigger brains than me. I am working on a page where the user will select a location from a dynamically generated dropdown list. I was able to create the php multidimensional array (tested and working) from a MySql database using the users information at login, but I'm having problems converting it to a javascript multidimensional array. I need to be able to access variables that I can pass to a number of text fields within an html form. For instance, if a user belongs to a company with multiple addresses, I need to be able to let them select the address they need to prepopulate specific text fields. php array creation: Code: if ($row_locations) { while ($row_locations = mysql_fetch_assoc($locations)) { $mail[$row_locations['comp_id']]=array('mailto'=>$row_locations['mailto'], 'madd'=>$row_locations['madd'], 'madd2'=>$row_locations['madd2'], 'mcity'=>$row_locations['mcity'], 'mstate'=>$row_locations['mstate'], 'mzip'=>$row_locations['mzip'], 'billto'=>$row_locations['billto'], 'badd'=>$row_locations['badd'], 'badd2'=>$row_locations['badd2'], 'bcity'=>$row_locations['bcity'], 'bstate'=>$row_locations['bstate'], 'bzip'=>$row_locations['bzip']); } } javascript function - this should create the array and send variables to text fields. Code: function updateAddress() { var mail = $.parseJSON(<?php print json_encode(json_encode($mail)); ?>); { if (comp_id in mail) { document.getElementById('mailto').value=mail.comp_id.mailto.value; document.getElementById('madd').value=mail.comp_id.madd.value; document.getElementById('madd2').value=mail.comp_id.madd2.value; document.getElementById('mcity').value=mail.comp_id.mcity.value; document.getElementById('mstate').value=mail.comp_id.mstate.value; document.getElementById('mzip').value=mail.comp_id.mzip.value; } else { document.getElementById('mailto').value=''; document.getElementById('madd').value=''; document.getElementById('madd2').value=''; document.getElementById('mcity').value=''; document.getElementById('mstate').value=''; document.getElementById('mzip').value=''; } } } Where is this breaking? Thanks in advance. I have the following array that contain the people who are on off on certain time: Code: var all = [ ["1234", "Jim", "2011-10-23 00:00:00", "2011-10-25 07:00:00"], ["1235", "Jack", "2011-10-21 00:00:00", "2011-10-21 08:00:00"], ["1236", "Jane", "2011-10-11 00:00:00", "2011-10-11 00:30:00"], ["1237", "June", "2011-10-20 00:00:00", "2011-10-20 12:00:00"], ["1238", "Jill", "2011-10-14 00:00:00", "2011-10-14 11:00:00"], ["1239", "John", "2011-10-16 00:00:00", "2011-10-16 10:30:00"], ["1240", "Jacab", "2011-10-19 00:00:00", "2011-10-20 08:30:00"] ]; The above array, I wish to use javascript to insert into the FullCalendar (http://arshaw.com/fullcalendar/). I notice that the only way seems to be using the FullCalendar array style (or structure) as follows: Code: $('#calendar').fullCalendar({ events: [ { title : 'event1', start : '2010-01-01' }, { title : 'event2', start : '2010-01-05', end : '2010-01-07' }, { title : 'event3', start : '2010-01-09 12:30:00', allDay : false // will make the time show } ] }); So, the question is: How do I insert my array to match with the FullCalendar array? cause FullCalendar array had a different array structure from my array - and I don't think so that I can write in this way: Code: $('#calendar').fullCalendar({ events:all }); Appreciate any help provided. I can't seem to figure out how to accomplish this. In my website, I would like the user to input text into a single or multiple textbox(es) and then have the contents of the textbox(es) stored to either a variable or an array. Then I would like to have that variable/array compared to other arrays. Basically, the user is searching for items in a database. The user can search for as many or as little items as they want. Then the item(s) will be compared to multiple arrays to find out if what the user wants is in the database. So for example, let's say the user is searching for recipes that have all or part of these ingredients: chicken, broccoli, lemon, honey. So, there would have been a total of 4 textboxes...one for each ingredient. These ingredients are stored to an array..lets call it ingredient(). In the database of recipes, each recipe has its own array which includes the ingredients needed to make the recipe, we'll call them tag1(), tag2(), and tag3(). Now, I want the array, ingredient(), to be compared to each of the "tag" arrays to see if any of the "tag" arrays include exactly match the ingredient() tag in part or in whole. Is this possible? Hey guys, I'm hoping this is possible or that there is an easier way to do this. I'm having an issue with displaying data from one array that contains information about users in a table that is controlled by a different array. Is it possible to do this or is this use of arrays to display the data the wrong approach? The table is located on one webpage, I simply want to extract one piece of information that I have placed in the initial array as part of the login script that contains user information (for validation for login etc) and display it in a table on the new webpage that is opened as a result of successful validation of the user details. I'm completely stumped and after many attempts I just can't seem to get it to work. Hi, i can't find the mistake in my little script hope someone can help me. PHP Code: <?php /* -------------------- read thumbfolder -------------------- */ function isRdyPfD($filename){ if ($filename == '.' || $filename == '..') { // To-Top-Dir return false; } $ext = explode(".",$filename); $ext = $ext[sizeof($ext) - 1]; $allowedformats = array ( 'jpg', 'png', 'jpeg', 'gif' ); return in_array($ext,$allowedformats); } function getPicsfromDir($dir){ /* array with names of the pictures in $dir */ if (is_dir($dir)) { if ($dh = opendir($dir)) { $filearray = array(); while (($file = readdir($dh)) !== false) { if (isRdyPfD($file) === true) { $filearray[] = $file; } } closedir($dh); return $filearray; } } else { return false; } } // End Function $thumbs = getPicsfromDir("./images/thumbs/"); /* -------------------- thumbfolder -------------------- */ echo "<div id='thumbslider'>\n"; echo "<ul id='thumbs'>\n"; for($i = 0; $i < count($thumbs); $i++){ echo "<li><img src=\"./images/thumbs/$thumbs[$i]\" onclick=\"thumbClick($i)\" /></li>\n"; } echo "</ul>\n"; echo "</div>\n"; /* -------------------- big size images folder -------------------- */ $bigSizeImages = getPicsfromDir("./images/"); //print_r($bigSizeImages); $jsValue = ''; for ($j=0; $j < count($bigSizeImages); $j++){ $jsValue = $jsValue . $bigSizeImages[$j]; if ($j < (count($bigSizeImages)-1)) { $jsValue = $jsValue . ","; } } ?> <script type="text/javascript"> images = new Array(<?php echo $jsValue ?>); function thumbClick(pos){ //alert(pos); alert(images[pos]); } </script> I can't trace the images array values? thanks for a feedback!!! Hi, In a nutshell,can anyone tell me how to copy a 2d (two dimensional ,2 dimensional) php array to 2d javascript array?I would be obliged if anyone can provide me a method of doing that OR I have written a code to copy a 2d php array to a 2d javascript array.It is working but there is one problem(please see the following).Can anyone tell me what I am doing wrong here? The 2d php array is $quest[100][6] and the 2d javascript array is questions[100][6] . I have written the javascript code inside the <?php....?> itself using echo "<script language="javascript" type="text/javascript">.......</script>; Now ,inside the javascript,when I try to copy the 2d php array to the 2d javascript array using the following method it works questions[0]= ["<?php echo join("\", \"", $quest[0]); ?>"]; questions[1]= ["<?php echo join("\", \"", $quest[1]); ?>"]; ... and so on However, if I try to do the same using the following method it does not work for (var i= 0; i <= 99; i++) { questions[i]= ["<?php echo join("\", \"", $quest[i]); ?>"]; } Why is that?What mistake am I making?Any help will be deeply appreciated.Thanks -----------------------------THE CODE------------------------------------ <?php Access database and store result of mysq_query in $result....... $result = mysql_query($query); for ( $count = 0; $count <= 99; $count++) { $quest[$count]=mysql_fetch_array($result,MYSQL_NUM);; } echo "<script language="javascript" type="text/javascript"> var questions = new Array(100); for (var i = 0; i <100; i++) { questions[i] = new Array(6); } /*The following method of copying 2d php array to 2d javascript array is not working for ( var i = 0; i <= 99; i++) { questions[i]= ["<?php echo join("\", \"", $quest[i]); ?>"]; } */ /*The following method ,however,is working*/ questions[0]= ["<?php echo join("\", \"", $quest[0]); ?>"]; questions[1] = ["<?php echo join("\", \"",$quest[1]); ?>"]; questions[2] = ["<?php echo join("\", \"",$quest[2]); ?>"]; ....and so on </script>"; mysql_close($db_server); ?> Hi, Here is a working code to copy 2d php array to 2d javascript array. Code: <html> <head> <?php for($i = 0; $i < 3; $i++) { for($j = 0; $j < 2; $j++) {$quest[$i][$j] = $i*10+$j;} } ?> <script type="text/javascript"> var questions = new Array(3); for (var i = 0; i < 3; i++) { questions[i] = new Array(2); } questions[0] = ["<?php echo join("\", \"", $quest[0]); ?>"]; questions[1] = ["<?php echo join("\", \"", $quest[1]); ?>"]; questions[2] = ["<?php echo join("\", \"", $quest[2]); ?>"]; document.write(questions[0][0] + "<br />"); document.write(questions[0][1] + "<br />"); document.write(questions[1][0] + "<br />"); document.write(questions[1][1] + "<br />"); document.write(questions[2][0] + "<br />"); document.write(questions[2][1] + "<br />"); </script> </head> </html> Now,here's the thing.Notice these lines in the code questions[0] = ["<?php echo join("\", \"", $quest[0]); ?>"]; questions[1] = ["<?php echo join("\", \"", $quest[1]); ?>"]; questions[2] = ["<?php echo join("\", \"", $quest[2]); ?>"]; I would like to put these lines in a loop,something like for (var i = 0; i < 3; i++) { questions[i] = ["<?php echo join("\", \"", $quest[i]); ?>"]; } But even after a lot of efforts I am unable to do so,what am I doing wrong?Thanks |