CS8661 - IP - LAB - MANUAL (1) (Repaired)
CS8661 - IP - LAB - MANUAL (1) (Repaired)
ENGINEERING
LAB MANUAL
INDEX
CY MARKS SIGNA
3 Validate the Registration, user login, user profile and payment by credit card pages using
JavaScript
5 Write programs in Java to create three-tier applications using servlets for conducting on-
line examination for displaying student mark list. Assume that student information is
6 Install TOMCAT web server. Convert the static webpages of programs 1&2 into dynamic
web pages using servlets (or JSP) and cookies. Hint: Users information (user id, password,
credit card number) would be stored in web.xml. Each user should have a separate
Shopping Cart.
7 Redo the previous task using JSP by converting the static web pages into dynamic web
pages. Create a database with user information and books information. The books
catalogue should be dynamically loaded from the database
8
Create and save an XML document at the server, which contains 10 users Information.
Write a Program, which takes user Id as an input and returns the User details by taking
III
the user information from the XML document
10 Write a web services for finding what people think by asking 500 people’s opinion for any
consumer product
ASSESSMENT
14 Develop an applet that receives an integer in one text field, and computes its factorial
Value and returns it in another text field, when the button named “Compute” is clicked.
text field in a range of 0 to 999 and shows it in another text field in words.if the number is
out of range it should show “out of range” and if it is not a number it should show “not a
PROGRAM:
<html>
<body>
<p>
<map name="imap">
</map>
<img border="0" src="imap.gif" usemap="imap" width="962" height="620">
</p>
</body>
</html>
<html>
<head>
<title>DELHI</title>
</head>
<body bgcolor="lavender">
</font></p>
<p align="left">
</font>
</p>
Delhi is the capital of INDIA. It is one of the metropolitan cities in INDIA. It is the ancient and advanced city.
Indian politics is mainly concentrates in this city.The Supreme court and defense headquarters are located in the city.
</font>
</p>
</font></p>
<p align="left">
</font></p>
</body>
</html>
Chennai web page:
<html>
<head>
<title>CHENNAI</title>
</head>
<body>
</head>
<body bgcolor="lavender">
<p align="center"><font face="arial" color="magenta" size="4">
<b><i><u><marquee>Welcome to CHENNAI</marquee></u>
</i></b></font></p>
</font></p>
<p align="left"><font face="times new roman" color="blue" size="4">
The city has International airport as wll as world's second beach <b> MARINA</b>.It has IT industry focus today.
</font></p>
<p align="left"><font face="times new roman" color="red" size="4">
<b><u><i>Important places:</b></u></i>
</font></p>
<p align="left">
<font face="times new roman" color="blue" size="3">
</body>
</html>
OUTPUT 1: OUTPUT 2:
Index Home page:
RESULT:
INLINE.html
<html>
<head>
<body>
<p>this text doesn't have any style applied to it </p>
</html>
EXTERNAL.html
<html>
<head>
</head>
<body>
<h1>Jeppiaar Engineering<em>College</em>:</h1>
<h2>Computer Science Engineering</h2>
<ul>
<li>Departments
<ul>
<li>CSE</li>
<li>IT</li>
<li>MCA</li>
</ul>
</li>
<li>ECE</li>
<li>EEE</li>
</ul>
<p><a class="nodec" href="http:\\www.jeppiaarcollege.org">Go to Jeppiaar website</a></p>
</body>
</html>
style.css:
BODY{background-color:green;font-family:sans-serif}
CAPTION{font-size:large;font-weight:bold}
H1{font-family:helvetica;color:blue}
H2{font-family:arial;color:red}
EMBEDDED.html:
<html>
<head>
<style type="text/css">
p.one
{
}
p.two
{
border-style:solid;
border-color:red blue
}
p.three
{
border-style:solid;
border-color:red blue green
}
p.four
{
border-style:solid;
}
</style></head></body>
</body></html>
<html>
<head>
<style type="text/css">
body{background-color:cyan}
h1{background-color:#00ff00}
h2{background-color:transparent}
p{background-color:rgb(250,0,250)}
</style>
<head>
<body>
<h1>JEC</h1>
<h2>Chennai</h2>
<p>this is a reputed college in TN</p>
</body></html>
RESULT:
AIM: Validate the Registration, user login, user profile and payment by credit card pages using JavaScript.
PROCEDURE:
• Home page:
Main.html:
<frameset cols=”25%,75%”>
<frame src=”left.html” name=”left”>
</frameset>
Top.html:
<html>
<body bgcolor=”pink”>
<br><br>
</body>
</html>
Right.html:
<html>
<body bgcolor=”pink”>
<br><br><br><br><br>
<h2 align=”center”>
<b><p> welcome to online book storage. Press login if you are having id otherwise press registration.
</p></b></h2>
</body></html>
Left.html:
<html>
<body bgcolor=”pink”>
<h3>
<ul>
<li><a href=”login.html” target=”right”><font color=”black”> LOGIN</font></a></li><br><br>
</li><br><br>
</ul>
</body>
</html>
<html>
<body bgcolor="pink"><br><br><br>
<script language="javascript">
function validate()
{
var flag=1;
if(document.myform.id.value==""||
document.myform.pwd.value=="")
{
flag=0;
alert("VALID INPUT");
}
else
{
alert("INVALID INPUT");
document.myform.focus();
}
}
</script>
<form name="myform">
<div align="center"><pre>
LOGIN ID :<input type="text" name="id"><br> PASSWORD:<input type="password" name="pwd">
</pre><br><br>
</div>
<br><br>
<div align="center">
</form>
</body>
</html>
Profile.html:
<html>
<body bgcolor=”pink”><br><br>
<script language=”javascript”>
function validate()
{
var flag=1;
if(document.myform.name.value==””||
document.myform.addr.value==””||
document.myform.phno.value==””||
document.myform.id.value==””||
document.myform.pwd.value==””)
{
flag=0;
}
var str=document.myform.phno.value;
var x;
x=str.substr(i,1)
if(!(x<=9))
{
flag=0;
break;
}
}
if(flag==1)
{
alert("VALID INPUT");
}
else
{
alert("INVALID INPUT");
document.myform.focus();
}}
</script>
<form name="myform">
<div align="center"><pre>
NAME :<input type="text" name="name"><br> ADDRESS :<input type="type" name="addr"><br>
<br><br>
<div align="center">
</form></body></html>
Books catalog :
Scart.html:
<html>
<body bgcolor="pink"><br><br><br>
<script language="javascript">
function validate()
{
var flag=1;
if(document.myform.title.value=="")
{
flag=0;
{
document.writeln("<body bgcolor=pink>");
document.writeln("title-->c"+" cost-->444");
}
else if(str=="jsp")
{
document.writeln("<body bgcolor=pink>");
document.writeln("title-->jsp"+" cost-->555");
}
else
{
flag=0;
}
if(flag==1)
{
alert("VALID INPUT");
}
else
{
alert("INVALID INPUT");
document.myform.focus();
}
}
</script>
</div>
<br><br>
<div align="center">
<input type="submit" value="ok" onClick="validate()">
</body>
</html>
Shopping cart:
Catalog.html:
<html>
<body bgcolor="pink"><br><br><br>
{
var flag=1;
if(document.myform.id.value==""||
document.myform.title.value==""||
document.myform.no.value==""||
document.myform.cost.value==""||
document.myform.date.value=="")
{
flag=0;
}
var str=document.myform.no.value;
var x;
for(var i=0;i<str.length;i++)
{
x=str.substr(i,1)
if(!(x<=9))
{
flag=0;
break;
}
}
str=document.myform.title.value;
var str1=document.myform.cost.value;
if(!((str=="c"&& str1==444) || (str=="jsp" && str1==555)))
{
flag=0;
}
if(flag==1)
{
alert("VALID INPUT");
}
else
{
alert("INVALID INPUT");
document.myform.focus();
}
}
</script>
COST OF BOOK
:<input type="text"name="cost"><br>
<br><br>
<div align="center">
</form>
</body>
</html>
Payment by credit card
Payment.html:
<html>
<body bgcolor="pink"><br><br><br>
<script language="javascript">
function validate()
{
var flag=1;
if(document.myform.id.value==""||
document.myform.pwd.value==""||
document.myform.amount.value==""||
document.myform.num.value=="")
{
flag=0;
}
var str=document.myform.amount.value;
var x;
for(var i=0;i<str.length;i++)
{
x=str.substr(i,1);
if(!(x<=9))
{
flag=0;
break;
}
}
str=document.myform.num.value;
for(var i=0;i<str.length;i++)
{
x=str.substr(i,1);
flag=0;
break;
}
}
if(flag==1)
{
alert("VALID INPUT");
}
else
{
alert("INVALID INPUT");
document.myform.focus();
}
}
</script>
<form name="myform">
<div align="center"><pre>
LOGIN ID :<input type="text" name="id"><br> PASSWORD :<input type="password" name="pwd">
name="num+"><br></pre><br><br>
</div>
<br><br>
<div align="center">
</form>
</body>
</html>
Order Confirmation
Order.html:
<html>
<head><title>order conformation</title><M/head>
<body bgcolor="cyan">
<center>
<h1><b>AMAZON</h1>
<pre><strong>
<b>Your order Is Conformed
</strong></pre>
<h2><b>THANK YOU</h2>
</center>
OUTPUT:
RESULT:
AIM:
To write a html program for invoking servlet using html.
PROGRAM:
HTML Form:
<html>
<head>
<title>Ordering Pen</title>
<body>
</body>
</html>
Servlet Code:
import javax.servlet.*;
import javax.servlet.http.*;
import java.io.*;
PrintWriter out;
int cost=Integer.parseInt(request.getParameter("cost"));
int quant=Integer.parseInt(request.getParameter("quant"));
String m=request.getParameter("item");
try{
out=response.getWriter();
out.println("<html><head><title>Order</title></head><body>");
out.println("Your Order for "+m+" of cost "+cost+" is accepted. Your total Bill is Rs."+cost*quant+".");
out.println("</body></html>");
}
catch(Exception e){}
}
OUTPUT 1: OUTPUT 2:
After submitting:
AIM:
To write a html program for invoking servlet from applet.
PROGRAM:
Invoke.html:
<html>
<head>
<title>hai</title>
</head>
<body>
<applet code="invokeHyp" width="450" height="400">
</applet>
</body>
</html>
invokeHyp.java:
import java.awt.*;
import java.awt.event.*;
import java.applet.*;
import java.net.*;
public class invokeHyp extends Applet implements ActionListener
{
String msg=" ";
Button submit,reset;
Label lbl1=new Label("Enter Quantity:");
{
submit=new Button("submit");
reset=new Button("reset");
add(lbl2);
add(item);
add(lbl1);
add(quant);
add(submit);
reset.addActionListener(this);
}
String str=ae.getActionCommand();
if(str.equals("submit"))
{
msg="Submit";
try
{
System.out.println("Hai");
URL myurl=new
URL("http://localhost:8080/servlet/sayhello?item="+item.getText()+"&quant="+quant.getText());
getAppletContext().showDocument(myurl);
}
catch(Exception e)
{
msg=e.toString();
}
}
else if(str.equals("reset"))
{
msg="Reset";
}
repaint();
}
public void paint(Graphics g)
{
g.drawString(msg,6,200);
}
}
myName.java:
import javax.servlet.*;
import javax.servlet.http.*;
import java.io.*;
PrintWriter out;
String myItem=request.getParameter("item");
try
{
out=response.getWriter();
out.println("<HTML><HEAD><TITLE>order</TITLE></HEAD><BODY>");
out.println("Your order for"+quant+" number of" +myItem+" is accepted.");
out.println("</BODY></HTML>");
}
catch(Exception e)
{System.out.println(e);
}}}
OUTPUT:
APPLET VIEWER AFTER SUBMITTING:
OUTPUT 2:
5. ONLINE EXAMINATION
AIM:
To write programs in Java to create three-tier applications using servlets for conducting on-line examination for displaying student mark list. Assume that
student information is available in a database which has been stored in a database server.
SERVLET CODE:
import java.io.*;
import java.sql.*;
import javax.servlet.*;
import javax.servlet.http.*;
String message,Seat_no,Name,ans1,ans2,ans3,ans4,ans5;
int Total=0;
Connection connect;
Statement stmt=null;
ResultSet rs=null;
public void doPost(HttpServletRequest request,HttpServletResponse
String url="jdbc:odbc:NEO";
Class.forNam("sun.jdbc.odbc.JdbcOdbcDriver");
}
catch(ClassNotFoundException cnfex){
cnfex.printStackTrace();
}
catch(SQLException sqlex)
{ system.out.println(e);
Seat_no=request.getParameter("Seat_no");
Name=request.getParameter("Name");
ans1=request.getParameter("group1");
ans2=request.getParameter("group2");
ans3=request.getParameter("group3");
ans4=request.getParameter("group4");
ans5=request.getParameter("group5");
if(ans1.equals("True"))
Total+=2;
if(ans2.equals("False"))
Total+=2;
if(ans3.equals("True"))
Total+=2;
if(ans4.equals("False"))
Total+=2;
if(ans5.equals("False"))
Total+=2;
try
{
Statement stmt=connect.createStatement();
}catch(SQLException ex){
}
response.setContentType("text/html");
PrintWriter out=response.getWriter();
out.println("<html>");
out.println("<head>");
out.println("</head>");
out.println("<body bgcolor=cyan>");
out.println("<center>"); out.println("<h1>"+message+"</h1>\n");
out.println("<h3>Yours results stored in our database</h3>");
out.print("<br><br>");
out.println("<b>"+"Participants and their Marks"+"</b>");
out.println("<table border=5>");
try
{
Statement stmt=connect.createStatement(); String query="SELECT *
out.println("<th>"+"Name"+"</th>");
{
out.println("<tr>");
out.print("<td>"+rs.getInt(1)+"</td>");
out.print("<td>"+rs.getString(2)+"</td>");
out.print("<td>"+rs.getString(3)+"</td>");
out.println("</tr>");
}
out.println("</table>");
}
catch(SQLException ex){ } finally
{
try
{
if(rs!=null)
rs.close();
if(stmt!=null)
stmt.close();
if(connect!=null)
connect.close();
}
catch(SQLException e){ }
}
out.println("</center>");
out.println("</body></html>");
Total=0; } }
HTML CODE:
<html>
<head>
<title>Database Test</title>
</head>
<body>
<center>
<h1>Online Examination</h1>
</ceter>
<b>2. It is a network layer's responsibility to forward packets reliably from source to destina-tion</b><br/>
</body>
</html>
OUTPUT 1: OUTPUT 2:
AFTER SUBMITTING
RESULT
<servlet>
<servlet_name>any name</servlet_name>
<servlet_class>myform</servlet_class>
</servlet>
<servlet_mapping>
<servlet_name>any name</servlet_name>
Start tomcat:
CREATING DATABASE
1)
Control panel-> Administrative Tools-> Data Sources(ODBC)
-->System DSN-->add (Microsoft Access Driver(*.mdb)🡪finish
🡪 add name ( give database name)
2)
Open Microsoft Access 🡪 create new database(give same database name)
🡪add table 🡪insert fields and values
SHOPPING CART
AIM:
Install TOMCAT web server. Convert the static webpages of assignments 2 into dynamic webpages using servlets and cookies. Hint: Users information (user id,
password,credit card number) would be stored in web.xml. Each user should have a separate Shopping Cart.
Main.html:
<html>
<body>
<br /><br /><br /><br /><br />
<h1 align="center"><U>ONLINE BOOK STORAGE</U></h1><br /><br /><br />
<h2 align="center"><pre>
<b>Welcome to online book storage.
Press LOGIN if you are having id
otherwise press REGISTRATION
</b></pre></h2>
<br /><br /><pre>
<div align="center"><a href="login.html">LOGIN</a><a href="reg.html"> REGISTRATION</a></div>
</pre>
</body>
</html>
Login page:
Login.html:
<html>
<body><br /><br /><br />
<form name="myform" method="post" action="login">
<div align="center"><pre>
LOGIN ID :<input type="text" name="id" /><br /> PASSWORD :<input type="password" name="pwd"
/></pre><br /><br />
</div>
<br /><br />
Profile servlet:
Profile.java:
import java.sql.*;
import java.io.*;
import javax.servlet.*;
import javax.servlet.http.*;
OUTPUT
Before Submitting
7. JSP
AIM:
Redo the previous task using JSP by converting the static web pages of assignments 2 into dynamic web pages. Create a database with user information and books
information and books information. The books catalogue should be dynamically loaded from the database. Follow the MVC architecture while doing the website.
PROCEDURE:
1) Create your own directory under tomcat/webapps (e.g. tr1)
2) Copy the html files in tr1
3) Copy the jsp files also into tr1
4) Start tomcat give the following command
Catalina.bat run
At install-dir/bin
5) at I.E give url as http://localhost:8081/tr1/main.html
Home page:
Main.html:
<html>
<body>
<br><br><br><br><br><br>
<h1 align="center"><u>ONLINE BOOK STORAGE</u></h1><br><br><br>
<h2 align="center"><PRE>
<b> Welcome to online book storage.
Press LOGIN if you are having id
Registration JSP:
Reg.jsp :
<%@page import="java.sql.*"%>
<%@page import="java.io.*"%>
<% response.setContentType("text/html");
out.println("<html><body>");
String name=request.getParameter("name");
String addr=request.getParameter("addr");
String phno=request.getParameter("phno");
String id1=request.getParameter("id");
String pwd1=request.getParameter("pwd");
int no=Integer.parseInt(phno);
Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
Connection
con=DriverManager.getConnection("jdbc:odbc:orcl","scott","tiger"); Statement
stmt=con.createStatement();
String sqlstmt="select id,pwd from login";
ResultSet rs=stmt.executeQuery(sqlstmt);
int flag=0;
while(rs.next())
{ if(id1.equals(rs.getString(1))&&pwd1.equals(rs.getString(2)))
{
flag=1;
Order servlet:
Order.java:
<%@page import="java.sql.*"%>
<%@page import="java.io.*"%>
<% int count;
out.println("<html><body>");
String id=request.getParameter("id");
8. XML
AIM:
Create and Save an XML document at the server, which contains 10 users information. Write program, which takes user ID as input and returns the user details by taking
the user information from XML Document.
Login Page:
Std.html:
<html>
<head>
<script>
function LoadXmlDoc(dname)
{
xmldoc=new ActiveXObject("Microsoft.XMLDOM");
xmldoc.async="false";
xmldoc.load(dname);
return xmldoc;
}
function validate()
{
var i,k,j=0;
xmldoc=LoadXmlDoc("student.xml");
var v1=myform.n2.value;
if(v1.length==0)
window.alert("enter the roll no.");
else
{
v1=parseInt(v1);
arr=xmldoc.getElementsByTagName("students");
for(i=0;i<arr.length;i++)
{
var txt=xmldoc.getElementsByTagName("rollno")[i].childNodes[0].nodeValue; if(txt==v1)
{k=i;
j=1;
}
}
if(j==1)
9. PHP
AIM
To write a program to implement Ajax live search application
ALGORITHM
Step 1: Create the HTML document.
Step 2: Create a HTML form
Step 3: Using the input tag get first name
Step 4: Invoke the script function ShowHint()
Step 5: Check the value of first name with php file content
Nosugesstion.html
<!DOCTYPE html>
<html>
<head>
<script>
function showHint(str)
{
if (str.length==0) {
document.getElementById("txtHint").innerHTML="";
return;
} else {
var xmlhttp=new XMLHttpRequest();
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","gethint.php?q="+str,true);
xmlhttp.send();
}
}
</script>
</head>
<body>
<p><b>Start typing a name in the input field below:</b></p>
<form action="">
First name: <input type="text" id="txt1" onkeyup="showHint(this.value)">
</form>
<p>Suggestions: <span id="txtHint"></span></p>
</body>
</html>
GETHINT.PHP
<?PHP
$A[] = "APPLE";
$A[] = "BABY";
$A[] = "COOL";
$A[] = "KITTY";
$Q = $_REQUEST["Q"];
$HINT = "";
$Q = STRTOLOWER($Q);
$LEN=STRLEN($Q);
FOREACH($A AS $NAME) {
$HINT = $NAME;
} ELSE {
?>
Output:
OUTPUT2:
To create a Web Service and the connect that web service to the database using java & also write a WSDL & SOAP code for that web service.
Program:
package db;
import java.sql.*;
import java.util.logging.Level;
import java.util.logging.Logger;
import javax.jws.WebService;
import javax.jws.WebMethod;
@WebService()
public class NewWebService {
@WebMethod(operationName = "dbcon")
public String dbcon() {
//TODO write your implementation code here:
String s="";
Connection con;
String line;
try {
Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
con=DriverManager.getConnection("jdbc:odbc:student");
Statement st=con.createStatement();
ResultSet rs=st.executeQuery("select * from stud");
line="<br>";
while(rs.next())
return s;
}
OUTPUT:
SOAP Request
Result:
Aim:
To create a web service for adding few numbers using NetBeans and write client side code to invoke the web service.
1.create the new project as above and give the name as addclient.
2. addclient project will be created. right click it and choose the following.
4.Then choose the following and add the source code in index.jsp and save it.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
</head>
<body>
<h1>Hello World!</h1>
<form name="" action="action.jsp" method="post">
Enter No1:<input name="fst" type="text" /><br/>
Enter No2:<input name="sec" type="text" /><br/>
<input name="ok" type="submit" value="check" />
</form>
</body>
</html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
</head>
<body>
<h1>Hello World!</h1>
<%-- start web service invocation --%><hr/>
<%
String n1=request.getParameter("fst");
%>
<%
try {
perpack.PerfectService service = new perpack.PerfectService();
perpack.Perfect port = service.getPerfectPort();
// TODO initialize WS operation arguments here
int n = aa;
// TODO process result here
java.lang.String result = port.perfectfind(n);
out.println("Result = "+result);
} catch (Exception ex) {
// TODO handle custom exceptions here
}
%>
<%-- end web service invocation --%><hr/>
</body>
</html>
To create a webpage with the following using html to embedded the style sheet
INLINE.html
<html>
<head>
<title> inline styles </title>
</head>
<body>
<p>this text doesn't have any style applied to it </p>
<p style="font-size :40pt">the style is applied to <t>"JEPPIAAR"</t>text</p>
<p style="font-size :15pt;color:red">
this text has been formated</p>
</body>
</html>
EXTERNAL.html
<html>
<head>
<title>linking to External style sheet</title>
<link rel="stylesheet"type="text/css"href="style.css"/>
</head>
<body>
<h1>Jeppiaar Engineering<em>College</em>:</h1>
BODY{background-color:green;font-family:sans-serif}
CAPTION{font-size:large;font-weight:bold}
H1{font-family:helvetica;color:blue}
H2{font-family:arial;color:red}
EMBEDDED.html:
<html>
<head>
<style type="text/css">
p.one
{
border-style:solid;
border-color:#00ff00
}
p.two
{
border-style:solid;
border-color:red blue
}
p.three
{
border-style:solid;
border-color:red blue green
}
p.four
{
border-style:solid;
border-color:red blue green
rgb(250,0,255)
}
</style></head></body>
OUTPUT 1:
INLINE.html
OUTPUT 2:
12. Write programs in Java using Servlets: Session tracking using hidden form fields and Session tracking for a hit count
HTML CODE:
<html>
<head>
<title>Ordering Pen</title>
<body>
<form name=order action="http://localhost:8080/servlet/sayhello" method=POST>
</form>
</body>
</html>
OUTPUT:
AIM:
To write a servlet code to implement session tracking for a hit count.
PROGRAM
import java.io.*;
import java.util.*;
import javax.servlet.*;
import javax.servlet.http.*;
public class SessionTracker extends HttpServlet {
res.setContentType("text/html");
PrintWriter out = res.getWriter();
out.println("<HTML><HEAD><TITLE>SessionTracker</TITLE></HEAD>");
out.println("<BODY><H1>Session Tracking Demo</H1>");
out.println("<P>");
out.println("<H2>Here is your session data:</H2>");
}
out.println("</BODY></HTML>");
}
}
<head><title>sessiontracker</title></head>
<body><h3>session tracking demo</h3>
</form>
</body></html>
OUTPUT:
OUTPUT 2:
RESULT:
PROGRAM:
Nosugesstion.html
<!DOCTYPE html>
<html>
<head>
<script>
function showHint(str)
{
if (str.length==0) {
document.getElementById("txtHint").innerHTML="";
return;
} else {
}
}
xmlhttp.open("GET","gethint.php?q="+str,true);
xmlhttp.send();
}
}
</script>
</head>
<body>
<p><b>Start typing a name in the input field below:</b></p>
<form action="">
First name: <input type="text" id="txt1" onkeyup="showHint(this.value)">
</form>
<p>Suggestions: <span id="txtHint"></span></p>
</body>
</html>
$A[] = "APPLE";
$A[] = "BABY";
$A[] = "COOL";
$A[] = "KITTY";
$Q = $_REQUEST["Q"];
$HINT = "";
$Q = STRTOLOWER($Q);
$LEN=STRLEN($Q);
FOREACH($A AS $NAME) {
$HINT = $NAME;
} ELSE {
?>