Total members 11797 |It is currently Sun Sep 22, 2019 12:59 am Login / Join Codemiles

Java

C/C++

PHP

C#

HTML

CSS

ASP

Javascript

JQuery

AJAX

XSD

Python

Matlab

R Scripts

Weka





Hi,,
This is application i made .It is a well know application.The main idea that when the user hit a word in the text input .The Browser send this word to the server.The Server search for a words that start with the same as the input start and replay back with an HTML code include these words.The Browser then take this response words and view it to the users .An live example on this is the Google suggestion [color=#0000BF]Here[/color].In the server side i am using JSP.If you don't know JSP you can create your server page with the programming language you want for example (PHP,ASP,..etc).Also you can add more features to this small Ajax application .for example you can use the database to get the suggestion words like Google does.
Here is the JavaScript code which called (Ajaxsc.js)
Code:
// Ajaxsc.js
// doSuggest
/*
   Writen by Mohamed Sami
   Developer
   Information Technology
   mail :[email protected]
   */
function doSuggest(word) {
  if(word.length>0)
  {
var request=null;
if (window.XMLHttpRequest) {
request = new XMLHttpRequest();
} else if (window.ActiveXObject) {
request = new ActiveXObject("Microsoft.XMLHTTP");
}

   if(request)
   {
    var url="Page1.jsp";
    url+="?suggestword="+word;
   
    request.open("POST",url);
    request.onreadystatechange = function()
    {
      
   if(request.readyState==4)
      {
document.getElementById("theResults").innerHTML=request.responseText;
     document.getElementById("theResults").style.visibility="visible";
      }

   }
   request.send(null);
   
   }
   else
   {
    alert("Your browser don't support AJax !");
   }
   }
   else
   {
    document.getElementById("theResults").innerHTML="";
    document.getElementById("theResults").style.visibility="hidden";
    }
   
}

And here is the JSP code :

Code:
<!--
   Writen by Mohamed Sami
   Developer
   Information Technology
   mail :[email protected]
   -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<HTML>
<HEAD>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
   pageEncoding="ISO-8859-1"%>

<TITLE>Page1.jsp</TITLE>
</HEAD>
<BODY>
<%
    String suggetsword=request.getParameter("suggestword").toLowerCase();
   
String[] mySuggests=new String[]{"Anna","Apple","An","America","Ali","Ahmed"
,"Brittany","Ball","Cinderella","Car","Diana","Door","Eva","Ear"
,"Fiona","Fan","Gunda","Game","Hege","High","Inga","India","Johanna","Joomla"
,"Kitty","Kitkat","Linda","Loser","Nina","Noise","Ophelia","Open","Petunia"
,"People","Amanda","Area","Raquel","Rar","Cindy","Close","Doris","Do","Eve"
,"Event","Evita","Sunniva","Sun","Tove","Tall","Unni","Under","Violet","Vote"
,"Liza","Land","Elizabeth","English","Ellen","Wenche","Water","Vicky","Vila"};

  out.println("<table width='100%' border='0' cellpadding='0' cellspacing='0'>");

   for(int i=0;i<mySuggests.length;i++)
   {
      if(mySuggests[i].toLowerCase().startsWith((suggetsword.substring(0,1))))
      {
        out.print("<tr><td>"+mySuggests[i]+"</td></tr>");
       
        }
   }
    out.println("</table>");
%>

</BODY>
</HTML>


Finally is the html code for the index page :
Code:
<!--
   Writen by Mohamed Sami
   Developer
   Information Technology
   mail :[email protected]
   -->
<HTML>
<HEAD>
<script type="text/javascript" src="Ajaxsc.js"></script>
<TITLE>index.html</TITLE>

</HEAD>
<BODY>

<INPUT type="text" size="50" id="text1" onkeyup="doSuggest(this.value);" />
<br/>


<div id = "theResults" style =
"width:22em;border:1px black solid;padding-left:2px;padding-right:2px; visibility: hidden">
</div>

</BODY>
</HTML>



Thats was all the files in the project .You can run it in your local host.But remember that you must have a JSP container to run the JSP file like (Tomcat , JBoss,..etc). If you faced any bugs while trying please reply my topic with the error , :smile:




Author:
Mastermind
User avatar Posts: 2707
Have thanks: 74 time

thanks


Author:
Newbie
User avatar Posts: 1
Have thanks: 0 time

you are welcome . :)


Author:
Mastermind
User avatar Posts: 2707
Have thanks: 74 time

thanks for you sharing

_________________
http://www.ghd-hair.co.nz


Author:
Newbie
User avatar Posts: 1
Have thanks: 0 time

Thanks for sharing the solution. I have a question is there a way we can tweek your code so that if we select one of the items from the suggested list it populates into the text box.
Something like what happens in Google.

Thanks In Advance,
Tanay Tandon


Author:
Newbie
User avatar Posts: 1
Have thanks: 0 time

Yes, you can.
you have modify only one row in Page1.jsp, in this mode:

if(mySuggests[i].toLowerCase().startsWith(suggetsword))

bye bye :-)


Author:
Post new topic Reply to topic  [ 6 posts ] 

  Related Posts  to : Ajax Source code to Suggest application with JSP Server side
 Client-side Caching using AJAX & Javascript     -  
 Need Help with Server side scriping in Java     -  
 Connecting Java Application to C++ Application from Code     -  
 My First Ajax application     -  
 remove space ,trim strings from left side ,right side ,both.     -  
 show figures side by side using subfigure     -  
 Client Server Mobile to PC Application     -  
 AJAX - Sending a request to a server     -  
 Source Code that consist of DES, AES, RSA     -  
 3D c++ game with source code     -  



cron





Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group
All copyrights reserved to codemiles.com 2007-2011
mileX v1.0 designed by codemiles team
Codemiles.com is a participant in the Amazon Services LLC Associates Program, an affiliate advertising program designed to provide a means for sites to earn advertising fees by advertising and linking to Amazon.com