JavaScript is not functioning

Hi there,

I am currently developing an web application. But I have a condition here whereby the javascript of my main page is not functioning.
I implemented a ‘Search’ Button and when it is clicked, it should me move to the searchBean.jsp but it do not perform as expected.

Here’s the code:


<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function searchLicense(str)
{
var xmlhttp;
if (str=="")
  {
  document.getElementById("txtHint").innerHTML="";
  return;
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","searchBean.jsp?q="+str,true);
xmlhttp.send();
}
</script>
</head>
<body>

<form name="searchform" method="post" action="">
<br><br>
<table align="center"><tr><td><h2>Search Authentication</h2></td></tr></table>
<table width="300px" align="center" style="border:1px solid #000000;background-color:#efefef;">
<tr><td colspan=2></td></tr>
<tr><td colspan=2> </td></tr>
  <tr>
  <td><b>Licensee Name</b></td>
  <td><input type="text" name="licenseeName" value=""></td>
  </tr>
  <tr>
  <td><b>Business Name</b></td>
  <td><input type="businessName" name="businessName" value=""></td>
  </tr>
  <tr>
  <td><b>License NO.</b></td>
  <td><input type="licenseNo" name="licenseNo" value=""></td>
  </tr>
  <tr>
  <td></td>
  <td><button type="button" onclick="searchLicense(this.value)">Search</td>
  </tr>
  <tr><td colspan=2> </td></tr>
</table>
</form>
<br />
</body>
</html>

Where should the correction been done? Please advise, thank in advance.

Your HTML doesn’t contain any element with an id of txtHint which would be throwing an undefined error causing the script to end, simply add this element and your code should work fine.