You can view the tutorials best in Google Chrome, Mozilla Firefox, Opera, higher version of Internet Explorer

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

Explanation

  • 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 ;)

java4s.txt

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 :-)






By [ Java/J2EE Developer & Web Designer ]
Founder of Java4s.com - Indian, lives in United States. You can contact me at sivateja [at] java4s.com
Follow me on


Comments

20 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:

    @atul

    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:

    hi,

    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

Name*
Mail*
Website



By posting your answer, you agree to our comments policy.
Most Recent Tutorials
Hibernate Recent Posts
Spring Recent Posts
Struts Recent Posts
Recomandded Links
Current & UpComing Tutorials
Sitemap :
spring Hibernate struts Json Ajax Log4j Log4j coreJava Servlets Web Services


Upcoming
  Web Services [ In Progress ], JSP
Facebook_Java4s  Twitter_Java4s  GooglePlus_Java4s  Youtube_Java4s 
© 2010 - 2014 Java4s - Get It Yourself.
The content is copyrighted to Sivateja Kandula and may not be reproduced on other websites.