Art. dialog and ajax asynchronous requests, ajax asynchronous requests

Source: Internet
Author: User

Art. dialog and ajax asynchronous requests, ajax asynchronous requests

I wrote some code last week, involving jquery asynchronous requests. I would like to summarize it here to help students who are new to programming.

 

It is used to the art. dialog framework and is very easy to use. It provides many simple methods for asynchronous requests.

Before loading and using art. dialog, you must introduce

1 <link href="/js/artDialog/css/blue.css" type="text/css" rel="stylesheet" />2 <script type="text/javascript" charset="utf-8" src="/js/artDialog/artDialog.js?skin=default"></script>


In jquery1.9.1 or later versions, live () events are not supported.

1 $(document).on("click","td #id",function(){2     3 })

Replaces live events and responds to dynamically displayed tags.

 

Obtain the required data:

Before an ajax asynchronous request, you must obtain the parameter value. There are two main ways to obtain the value transmitted from the page.

Whether it is the response button <a> or other, you need to add the incoming parameter values in the corresponding tag, such:

1 <a id="ajaxQuery" name="xxx" age="18" >ajaxquery</a>

Its response event acquisition parameter method:

$ (Document ). on ("click", "# ajaxQuery", function () {var name = $ (this ). attr ('name'); var age = $ (this ). attr ('age'); // you can obtain the attribute value to implement var value = $ (this ). val (); // obtain the value of the tag })

 

Because ajax requests are generally asynchronous requests, after a. get method is executed, the data of such methods cannot be passed to subsequent function calls.

 

The dialog box displays:

Generally, the basic steps for calling art. dialog are as follows:

1 art. dialog () {2 lock: true, // screen lock 3 background: '# 000000', // background color 4 opacity: 333333, // transparency 5 title: 'title ', 6 id: '', 7 content:'' // The html Script in the pop-up box. 8 OK: function () {9 10 11} 12}

 

Write the ajax request script in OK: function,

1 $. getJSON ('url', function (data) {2 // The url is the requested url. Parameters and values can be directly followed by parameters and parameters passed 3 });

Or

1 $.getJSON( 'URL' ,data,function(data) {2 3 })

Data is the transmission parameter.

 

After the request is complete, determine whether the response is successful based on the response parameters. If the response is successful, you can return the specified page

1 if ( data.code = 'true' ) {2         window.location.href = 'url';3 }

 

Basically, the entire process of using art. dialog is over here. Next, let's talk about these ajax requests and the submission of multiple options.

Multiple options:

var valueArr = [];$("#id option:selected").each(function(){      var value = $(this).val();      valueArr.push( value );}

Checked multiple options:

1 var valueArr = [];2 $("#id td .checked").each( function() {3        var value = $(this).val();4        valueArr.push( value );5 }

 

Ajax request method:

1 $.post("url",{'data':valueArr,'data2': value} ,function( data ) {2 3 },json);

 

There is a better method to handle form submission:

 1 var FormValue = $("#FormId").serialize(); 2 $.get ( "url",FormValue,function(data){ 3          data = eval("(" + data + ")");     //json decode 4          if(data.code === 1001 ) { 5                 window.location.href = '/url'; 6      } 7          else { 8               return false; 9      }10 });

 

Other ajax methods include $. ajax $. getAjax and so on. You can also directly use the jquery submit event to implement form submission.


What is an ajax asynchronous Web application that uses the request/Response Model to obtain a complete HTML page from the server? Often, click a button to wait for the server to respond, click another button, and then wait for the sample process to have Ajax and XMLHttpRequest the object requires the user to wait for the server to respond to the request/Response Model and respond to the local request.
How can I understand ajax Asynchronization ???

The JavaScript program on the AJAX core client can implement asynchronous execution, which is opposite to synchronous execution. synchronous execution means that the Code must be executed in sequence. This is an example and you will understand it!

Line_1
Line_2
Line_3

Line_1 must be completed before Line_2.Line_1 can call functions. It may be complicated to have functions. It may take several hours to complete the operation. In this case, Line_2 can be executed only after Line_1 is fully executed, similarly, Line_3 does!

Asynchronous mode is the same. It is also assumed that Line_1 takes several hours to call the function, and Line_2 must be executed after Line_1 is executed. Similarly, Line_3 is also required!

Asynchronous execution has a special function called back. in the same example, when Line_1 calls a function, it specifies that another function must be called after the function is executed. after several hours, after the function is executed (or an error may occur), a callback command will be issued, and the command will call the specified function to notify the program that "the execution is complete "., some parameters will also be passed, which can be calculated in hours!

Do you understand what I mean! As for how to solve AJAX problems (such as bookmarking and button bounce), let's look for relevant information on our own. If you know something, let's discuss and make progress together!

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.