01.5.2010

More about jQuery AJAX

Bookmark and Share
Add to DZone

jQuery made AJAX simple by using .ajax() function.
The syntax for this function is:

$.ajax( /* properties */);

Now let me explain what properties we can use in this function.

First, I would like to tell you what basic (standard) options for .ajax() as follow:
Properties:
- url: String /* The URL to send the request to */
- type: String /* The request type ("GET", "POST") */
- contentType: String /* default: "application/x-www-form-urlencoded" */
- data: Object, String /* Data to be sent to the server. It is converted to a query string, if not already a string. It's appended to the url for GET-requests. See processData option to prevent this automatic processing. Object must be Key/Value pairs. If value is an Array, jQuery serializes multiple values with same key i.e. {foo:["bar1", "bar2"]} becomes '&foo=bar1&foo=bar2' */

Events:
- beforeSend: Function /* This function runs just before sending the request */
- success: Function /* This is an important part. Here we run the code because the request is done */
- complete: Function /* This function runs after the success is done and errors are shown */
- error: Function /* This function runs when error occurred
function(ajaxHnadler,eventHandler){
// ajaxHandler: xmlHTTP object
// eventHandler: handles the event as string
*/
- timeout: Function /* runs when request is timed out */

There are more options, you can check them on jQuery website.
Actually, I cannot create a demo to test all mentioned properties and methods... So, if you experienced a problem or need some help, please contact me.

For more information about jQuery AJAX Please visit: click here.
You can also read about .GET and .POST

01.2.2009

Learn AJAX, AJAX tutorial

Bookmark and Share
Add to DZone

What's AJAX?

AJAX (Asynchronous JavaScript and XML) is a newly coined term for two powerful browser features that have been around for years, but were overlooked by many web developers until recently when applications such as Gmail, Google suggest, and Google Maps hit the streets.

The two features in question are that you can:

  • Make requests to the server without reloading the page
  • Parse and work with XML documents

Step 1 – say "Please!" or How to Make an HTTP Request

In order to make an HTTP request to the server using JavaScript, you need an instance of a class that provides you this functionality. Such a class was originally introduced in Internet Explorer as an ActiveX object, called XMLHTTP. Then Mozilla, Safari and other browsers followed, implementing an XMLHttpRequest class that supports the methods and properties of Microsoft's original ActiveX object.

As a result, in order to create a cross-browser instance (object) of the required class, you can do:


if (window.XMLHttpRequest) { // Mozilla, Safari, ...
http_request = new XMLHttpRequest();
} else if (window.ActiveXObject) { // IE
http_request = new ActiveXObject("Microsoft.XMLHTTP");
}

(For illustration purposes, the above is a bit simplified version of the code to be used for creating an XMLHTTP instance. For a more real-life example, see step 3 of this article.)

Some versions of some Mozilla browsers won't work properly if the response from the server doesn't have an XML mime-type header. To satisfy this, you can use an extra method call to override the header sent by the server, just in case it's not text/xml.


http_request = new XMLHttpRequest();
http_request.overrideMimeType('text/xml');

Read more »

12.31.2008

Better way to load XML document.

Bookmark and Share
Add to DZone

The better way to load XML document on all browsers is to use AJAX technique.

After testing XML with Javascript. I fount that Safari (on Mac OSX 10) does not support XML with Javascript.
So, How to load it then?

Read more »

Free Blog Themes / Templates