title: Ajax-HTML for doing simple calculator
body: <p><strong>Question:</strong>  Implement a basic calculator application by getting the two operands and one operator from the form in a textbox. Also have a button called result and when the same is clicked display the result. Only the result part of the page must change</p>
  
  <p><strong>My code is here, but its not at all working, please help me in displaying the output</strong></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;meta charset="ISO-8859-1"&gt;
  &lt;title&gt;Insert title here&lt;/title&gt;
  &lt;script&gt;
  function showResult(id,url)
  {
      var xmlhttp;
      if (window.XMLHttpRequest)
        {// code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
        }
      else
        {// code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
      var val1=document.form1.value1.value;
      var valu1=parseInt(val1);
      var val2=document.form1.value2.value;
      var valu2=parseInt(val2);
      var val3=document.form1.operator.value;
      var result;
  
      xmlhttp.onreadystatechange=function()
        {
        if (xmlhttp.readyState==4 &amp;&amp; xmlhttp.status==200)
          {
          document.getElementById("id").innerHTML=xmlhttp.responseText;
          }
        }
      if("+"==val3)
      {
      result=valu1+valu2;
      //alert(result);
      }
  else if("-".equals(val3))
      {
      result=val1-val2;
      }
  else if("*".equals(val3))
  {
  result=val1*val2;
  }
  else if("/".equals(val3))
  {
  result=val1/val2;
  }
  else
      {
      alert("choose oly +,-,*,/");
      }
      xmlhttp.open("GET",url,true);
      xmlhttp.send();
  
  
  }
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;form name=form1 method=get&gt;
  &lt;input type=text name="value1"&gt;
  &lt;input type=text name="value2"&gt;
  &lt;input type=text name="operator"&gt;
  &lt;input type=button value="Result" name=result onClick="showResult('ajaxDiv','BasicCalc.html')"&gt;
  &lt;/form&gt;
  &lt;div id="ajaxdiv"&gt; Your Result soon will be display here&lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>