AJAX Learning Record

2010-08-13  来源:本站原创  分类:Web  人气:149 

AJAX Learning Record

1. Definition:

XMLHTTP is a set in the javascript, vbscript, Jscript scripting languages such as sending or xml via http protocol and other data API

It is the biggest advantage is that we can update part of page

2. AJAX technology is used

javaScript: implementation client-side data transmission and interface updates are implemented ajax programming language;

XMLHttpRequest: browser, built-in used for asynchronous data transmission and reception of objects, is the core like AJAX;

Css + div: on the users, AJAX is the value of the user interface more friendly --- this of course, rely on css + div achieved;

DOM model: AJAX common technique is to use js dom component to respond to events or update;

Xml: XML is only a transport format of the data, often in ajax applications to xml format c / s between the exchange of data;

Html: The Needless to say, and data information displayed on the browser language.

3. AJAX three-step program

1. To take to the XMLHTTP object

function getRequestObject(){
        if(window.XMLHttpRequest){
                request = new XMLHttpRequest();
        }else if(window.ActiveXObject){
      try{
          request = new ActiveXObject("Msxml2.XMLHTTP");
      }catch(e){
          try{//IE Browser
                  request=new ActiveXObject("Microsoft.XMLHTTP")
          }catch(e){

          }
      }//end try
        }else{
                 window.alert(" Your browser does not support XMLHttpRequest, will not be able to use  AJAX.");
        }
}

(2) set the callback function, the server sends back the information display to the development of components

// Will be returned by the server in the root update div
function processResult(){

        // Make sure the server answer ok, request objects processed
        if((request.readyState==4)&&(request.status==200)){
                alert(" The server returns the  :"+request.responseText);
                // Display to the specified component
                document.getElementById("errorMSG").innerHTML=request.responseText;
        }

}

(3) a request with the post

//AJAX Send a post request
function sendRequest(){
     // Get  XMLHttpRequest
    getRequestObject();
    // To bind a callback method
    request.onreadystatechange=processResult;
   // Send a request
    request.open("post","LoginAction",true);
    request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
     var username=document.getElementById("username").value;
    request.send("username='"+username+"'");

}

To get a request

function sendRequest(){
     // Get  XMLHttpRequest
    getRequestObject();
    // To bind a callback method
    request.onreadystatechange=processResult;
   // Send a request  

     var username=document.getElementById("username").value;
    request.open("get","LoginAction?username="+username,true);
    request.send(null);
}

The character set encoding issues will exist, will enter the Chinese will be garbled.

4. To solve hair problems and methods

1. Send a request garbled problems

(1) method to send the request to get it, I have not found a solution.

(2) send a request to post, long as you write

request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

Words, the problem will not be garbled, and it is utf-8 default encoding format, so the server side not to set the encoding of the request

It is worth noting that if the request method to post, if it does not write the above sentence, to the server's value is null

And to pay attention to the order of the problem, first write

request.open("post","LoginAction",true);

Writing

request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

Otherwise, the value is null

2.js program does not error, so it is that error detection, however, any program is wrong, the program will break at that, not the smooth implementation of the results you want, so we should pay attention to write start writing test statement

3. Why do we open the third parameter set to true?

Specifies whether the asynchronous request processing.

True said the script will send () method after the continue without waiting for a response from the server.

onreadystatechange event to make the code complicated. But this is not the case the server response to prevent the code to stop the most secure method.

By this parameter is set to "false", can save the extra onreadystatechange code. If the request fails if the rest of the code execution does not matter, you can use this parameter.

4. Call the callback method, the method name can not be bracketed. Such as:

request.onreadystatechange=processResult;

processResult not write parentheses, or AJAX can not run correctly

5. When the code in the implementation of the

var descs=request.responseXML.getElementsByTagName("desc");

This sentence does not continue on the implementation of the time, the server sends the xml file was wrong, or the

response.setContentType("text/xml; charset=gbk");

The text / xml written in other formats.

5. Uploaded file in the five classic example AJAX

相关文章
  • AJAX Learning Record 2010-08-13

    AJAX Learning Record 1. Definition: XMLHTTP is a set in the javascript, vbscript, Jscript scripting languages such as sending or xml via http protocol and other data API It is the biggest advantage is that we can update part of page 2. AJAX technolog

  • Learning Record: [ArcGIS] FindParameters_ query parameters 2010-04-24

    On FindTask main parameters of the query parameters FindParameters record: contains: whether to accept fuzzy look. layerIds: query plan level. searchFields: query field. searchText: query string. executeComplete: trigger after the completion of Code

  • SQL Server2005 learning record 2010-04-26

    // The total scores of all students seeking select sum(s_mark) from stumark // The average scores of all students seeking select avg(s_mark) as Database Average score from stumark where s_subject = 'database ' select count(*) as Pass number from stum

  • ajax learning document 2010-04-28

    http://www.w3school.com.cn/ajax/ajax_database.asp

  • AJAX Learning Summary (4) --- solve the cache problem 2010-08-02

    Step 1. New Project ajaxtrain Step 2. WebRoot folder under the new jslib and jQuery library (jquery-1.4.2.min.js) placed in the directory Step 3. New Servlet package servlet; import java.io.IOException; import java.io.PrintWriter; import javax.servle

  • AJAX Learning Summary (9) --- Jquery Example: auto-complete function simulation googlesuggest 2010-08-07

    Step 1. New Project JqueryTrain Step 2. Import Jquery library, and placed under jslib documents; import package: jstl.jar and standard.jar, note that if the 1.1 version Step 3. New servlet package servlet; import java.io.IOException; import java.util

  • AJAX Learning Summary 2010-10-17

    A, AJAX concept AJAX is a local interface updated. In short, the B / S format to the user C / S interface look and feel. The English name is AJAX Asynchronous JavaScript and XML, (Asynchronous JavaScript and XML technology). Under a little explanatio

  • ajax learning, ExtJS framework 2010-10-26

    Today continue to learn ajax, a major study of the popular Ajax frameworks ext, Dong Wei, a teacher is talking, Dong teacher was a lot of experience, combined with his practical application of ext project was explained to the ext. ExtJS is a very nic

  • complex data type oracle learning record five --pl/sql 2010-11-10

    -- How to use composite data types -- A .pl/sql records --1. In the Customize select into pl/sql Records declare -- Custom record variable types type comtype_record_type is record( id communitytype.community_type_id%type, name communitytype.name%type

  • Ajax learning experience 2010-11-10

    / * var newmessage = "message =" + message.value; xmlHttp.open ("POST", "insertblog.do", true); xmlHttp.setRequestHeader ("Content-Type", "application / x-www-form-urlencoded"); xmlHttp.send (newmessage);

  • java Spring Learning Record 2010-11-18

    Recently, learning spring, think spring's function is too strong, and now sum up what they have learned the following today, feeling a bit less to learn, not However, spring should learn, but also double the estimate to work hard, even the teachers w

  • Ajax Learning (xml application) 2010-12-18

    / / Server ................ public class AJAXXmlServer extends HttpServlet { protected void doGet (HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { //============= Written text / xml response.setContent

  • JQuery's? Ajax Learning (2) 2011-01-01

    The last major study of several top JQuery's Ajax methods, mainly to learn about the $. Ajax () method of the underlying. The main parameters of this method under study: 1. Url String type the address to accept the request 2. Type String type GET or

  • key-value database, Mongo learning record 2009-07-08

    Bored at work today, ha ha, want to look at key-value database, I heard that this stuff is fire, and I hurried back to fashion, Eupolyphaga a HA HA . The Internet is a bit of information that he feels very good Mongo, the website is also very simple,

  • Flex learning record (create a chart) 2010-03-24

    There are many types of chart in use must be clear before the toolbox for which the chart calls. Each chart has a ChartSeries corresponding object. To the data explicitly expressed as a particular chart We must first add the corresponding number of c

  • [From time to time update] Actionscript design pattern learning record 2010-07-29

    1. Event mechanism 1. As common and built-in decoupling mechanism to address the following issues a) the traditional callback mechanism can only be one to one, resulting in strong coupling b) use of non-traditional mechanisms for a unified approach t

  • Crontab learning record - Linux Notes 1 2010-07-30

    The first 1 minute 1 to 59 The first 2 hours 1 to 23 (0 Midnight) Column 3 1 ~ 31 Article 4 1 12 The first five weeks 0 and 6 (0 for Sunday) Article 6 of the command to run The following is the format of crontab: Timeshare week to run the command sun

  • AJAX Learning Summary (6) --- can be contracted to start the cascading menu and local refresh 2010-08-02

    Step 1. New Project JqueryTrain Step 2. Jslib in the WebRoot folder under the new, and come into the class library jquery Step 3. New html file --- JqueryMenu. Html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html&g

  • AJAX Learning (five-step method (post, get)) 2010-12-18

    / / Js part function verify () { var username = document.getElementById ("username"). value; //================================================ ========= / / 1. To create XMLHttpRequest object / / Required for IE browsers and other types of diff

  • oracle learning record 2010-10-12

    First close to prepare for back order oracle-quickly remove duplicate records http://hi.baidu.com/datangdiguo/blog/item/0b533433d63280fd1a4cffcb.html