Ajax First Program With Explanation

Ajax » On Aug 11, 2011 By Sivateja

Let us see first ajax program..,  so that i can explain the inner concepts practically :-)

Files used…

  • Firstprogram.html
  • java4s.txt


  • Once the document loaded then immediately we will be able to see one button Change Content , and see i have been given onclick=”fun1()” [ line number 33 ] means once we click on this button controller will go to line number 4 and will starts execute that fun1()
  • At line number 6, i have taken one variable with name a
  • For any ajax program, we must create one request object to send our ajax request to the server, that ajax object is nothing but XMLHttpRequest object
  • See line number 8,  i have written window.XMLHttpRequest means am checking whether my browser supports XMLHttpRequest object or not, if yes assigning XMLHttpRequest object into a [ a=new XMLHttpRequest(); ] else i mean if our web browser doesnt supports XMLHttpRequest object then we can assign ActiveXObject   [ which supports old web browsers ] into our variable a [  a=new ActiveXObject(“Microsoft.XMLHTTP”); ]
  • So from line numbers 8 -15 request object creation work been done
  • Now controller directly jumps to line number 25,  and opens the connection and send the request to java4s.txt (this is my notepad file), see actually the 3rd parameter i have given as true means Asynchronous data transfer will be activated
  • Finally request will be sent in line number 26, that’s it.
  • If server sends the response back to our application then controller will automatically execute from line number 17 – 23, you may get one doubt like why its not executed initially… ? there is a reason actually this a.onreadystatechange=function() executes only when we get the response from the server, hope you are clear ;)


welcome to java4s.com


That’s it mates just put these 2 files, in one folder and test the example of your own, and i will explain more about this open() and send() methods in the next sessions, just don’t think much about this :-)

Java/J2EE Developer & Web Designer, founder of Java4s.com. Sign-up for the email newsletter for your daily dose of Java tutorials.
Email: sivateja@java4s.com


41 Responses to “Ajax First Program With Explanation”
  1. Jovin says:

    Nice..Simple to understand..
    suitable for a beginner like me…

  2. Mohammed Vaseem says:

    Superb explaination of AJAX tutorial…

    Thanks a lot 4 sharing java4s Team…….. … :)

  3. narendra says:

    Thank you very much

    this is very help full for me

  4. Java4s says:

    @Jovin,@Mohammed Vaseem,@Narendra

    You welcome friends..! :-)

  5. atul says:

    sir this is not working i have make both file reside in a folder on desktop ,when we execute html file then nothing happen

  6. Java4s says:


    Deploy in Tomcat or any other server and try, that should work.

  7. Naga says:

    Hi Java4s team,please provide complete spring tutorial,we are eagerly waiting for your updations.

  8. shashank says:

    hi java4s team,

    when i am trying to run this program in firefox ,

    I am getting ActiveXObject is not defined.

  9. Nagaraju says:


    will you please povide about SpringIntegration and Importance of it.
    also povide the GWT Material.

    Thank you

  10. abhi says:

    hello sir this is supub example but how can be execute ajax program with xml file plz help me…..

  11. Preetha says:

    Its clear..Thank you

  12. SangraM says:

    Nice tutorial…….

  13. mak.capri says:

    ncie.. understand!

  14. kiran N says:

    thank you java4s team… simply superb…..

  15. ragunath says:

    thanks u!
    ajax concept!
    very nice!

  16. Sameer says:

    Hello Sir your explanation is superb and very easy to understand but for me the example is not working when i click “Change Content” button nothing happens please help!!!!!!!!!

  17. shanaya says:

    Hello Sir your explanation is really nice but what is the purpose of java4s.txt file. where it is stored and why?

  18. venu says:

    In line 21 instead of divID can we give particular textbox id?

  19. trinadh says:

    I am getting the following error

    java.lang.NumberFormatException: null
    at java.lang.Integer.parseInt(Unknown Source)
    at java.lang.Integer.parseInt(Unknown Source)
    at org.apache.jsp.index_jsp._jspService(index_jsp.java:61)
    at org.apache.jasper.runtime.HttpJspBase.service(HttpJspBase.java:70)
    at javax.servlet.http.HttpServlet.service(HttpServlet.java:717)
    at org.apache.jasper.servlet.JspServletWrapper.service(JspServletWrapper.java:377)
    at org.apache.jasper.servlet.JspServlet.serviceJspFile(JspServlet.java:313)
    at org.apache.jasper.servlet.JspServlet.service(JspServlet.java:260)
    at javax.servlet.http.HttpServlet.service(HttpServlet.java:717)
    at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:290)
    at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
    at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:233)
    at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:191)
    at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:127)
    at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.java:102)
    at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineValve.java:109)
    at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:298)
    at org.apache.coyote.http11.Http11Processor.process(Http11Processor.java:852)
    at org.apache.coyote.http11.Http11Protocol$Http11ConnectionHandler.process(Http11Protocol.java:588)
    at org.apache.tomcat.util.net.JIoEndpoint$Worker.run(JIoEndpoint.java:489)
    at java.lang.Thread.run(Unknown Source)

  20. surya says:

    thank you so much for all tutorials

  21. srinivasarao says:

    It is very useful for beginners like me. I don’t know any thing about AJAX. But now i got every thing about Ajax. Thanks Sivateja…very nice tutorial try to develop reaming technologies just like this.

  22. Basanta says:

    I save this html file in F:\ as ajax1.html and I create a text file called java4s.txt in same location.Then I open that html file in chrome.Finally I click button.But I did not get the effect. So please tell me how to execute this program.

  23. Ammu says:

    kindly let to know how to run this file since on button click its not effecting in the java4s.txt file

  24. Dilip says:

    For correct working of this example. Do the following:
    Create a text file namely java4s.txt in the same folder where FirstProgram.html is kept with some text content.
    Change the condition in FirstProgram.html as
    if(a.readyState == 4 && a.status == 0) instead of if(a.readyState==4 && a.status==200)


  25. aur says:

    Hello Sir,
    Still I am not getting the solution.Not thing is changing even after button click

  26. niroj says:

    it is very useful for begginers

  27. sahana says:

    Thank you :-)

  28. Deepu says:

    Please provide the SVN,MAVEN tool Tutorial
    Its very useful to everyone…..

  29. Shaikh Uzair says:

    Its Really Awesome Example for Beginners like me… Cox where ever I Look For Ajax Example They Directly Talk About Severs Servlets JSP and ASP… I can understand that ajax meant for it but for Beginners like me in AJAX i completely cant understand it… Well this example is not working in Chrome I tired it nothing is happening…. then i tried in Firefox and there it works like a charm ;) :D

  30. Vishwash says:

    Really Very Helpful to me . thank you so much

  31. Sanny says:

    Nice to understand at beginner level…

  32. Teju barbie says:

    Its helpfull to all.……
    Thank u sir

  33. manoj says:

    i need client request & server response program , by using textbox

  34. Akshay Deshmukh says:

    Thanks. Its very helpfull

  35. Kamalpreet Singh says:

    Really you make it very easy to understand. Thank you very much :)

  36. ramusesan says:

    what is this if (a.readyState==4 && a.status==200)

  37. mohan says:

    superbb… like it

  38. Ayaz says:

    cool bro

  39. Prakash says:

    clear and simple.
    Thanks a lot :-)

  40. Prakash says:

    I had a doubt, how to get the too many content from server and display it in browser dropdown list box

  41. amit sngh says:

    awesome style to provide the contents. i think tutorial says a lot in a very few lines.
    Best tutorial leaning…keep going dear .


By posting your answer, you agree to our comments policy.
© 2010 - 2016
Java4s - Get It Yourself.
The content & design is copyrighted to Sivateja Kandula, it may not be reproduced on other websites.
What would you like to learn today?
Browse these popular technologies
Hibernate spring struts Servlets ajax Log4j jQuery Json Core Java Web Services AngularJs

Most Recent Tutorials
Hibernate Recent Posts
Spring Recent Posts
Struts Recent Posts
Recomandded Links
Current & UpComing Tutorials
  Web Services [ SOAP ], JSP
Facebook_Java4s  Twitter_Java4s  GooglePlus_Java4s  Youtube_Java4s 
Contact | About Us | Privacy Policy | Advertise With Us

© 2010 - 2016 Java4s - Get It Yourself.
The content is copyrighted to Sivateja Kandula and may not be reproduced on other websites.