YUI Library Home

YUI Library Examples: Connection Manager: Connection Manager GET Transaction

Connection Manager: Connection Manager GET Transaction

To create a GET transaction using Connection Manager, you will need to construct a querystring of key-value pairs and append it to the URL. The following code example provides a step-by-step approach to creating a simple GET transaction.

Click "Send a GET Request" below to try it out, then read the description below to learn how to create a simple transaction using Connection Manager.

Using Connection Manager to Retrieve a File via HTTP GET

Source file and dependencies

Load the Yahoo Global Object and Connection Manager source files:

1<script src="yahoo.js"></script> 
2<script src="event.js"></script> 
3<script src="connection.js"></script> 
view plain | print | ?

Assemble the Querystring

Construct a querystring with two key-value pairs of username = anonymous and userid = 0:

1/*
2 *
3 * Create a querystring with example key-value pairs of
4 * username and userid.  Remember to encode the querystring
5 * if and when the string contains special characters.
6 *
7 */ 
8var sUrl = "php/get.php?username=anonymous&userid=0"
view plain | print | ?

The Callback Object

Create a callback object to handle the response, and pass an object literal to both success and failure handlers as the argument.

1var div = document.getElementById('container'); 
2 
3var handleSuccess = function(o){ 
4    if(o.responseText !== undefined){ 
5        div.innerHTML = "<li>Transaction id: " + o.tId + "</li>"
6        div.innerHTML += "<li>HTTP status: " + o.status + "</li>"
7        div.innerHTML += "<li>Status code message: " + o.statusText + "</li>"
8        div.innerHTML += "<li>HTTP headers: <ul>" + o.getAllResponseHeaders + "</ul></li>"
9        div.innerHTML += "<li>Server response: " + o.responseText + "</li>"
10        div.innerHTML += "<li>Argument object: Object ( [foo] => " + o.argument.foo + 
11                         " [bar] => " + o.argument.bar +" )</li>"
12    } 
13
14 
15var handleFailure = function(o){ 
16    if(o.responseText !== undefined){ 
17        div.innerHTML = "<li>Transaction id: " + o.tId + "</li>"
18        div.innerHTML += "<li>HTTP status: " + o.status + "</li>"
19        div.innerHTML += "<li>Status code message: " + o.statusText + "</li>"
20    } 
21
22 
23var callback = 
24
25  success:handleSuccess, 
26  failure: handleFailure, 
27  argument: { foo:"foo", bar:"bar" } 
28}; 
view plain | print | ?

Initiate the GET Transaction

Call YAHOO.util.Connect.asyncRequest to send the request to get.php, and the PHP file will return the output of $_POST via print_r(). The handleSuccess callback will print the response object's properties, including the server response data.

1var request = YAHOO.util.Connect.asyncRequest('GET', sUrl, callback); 
view plain | print | ?

Configuration for This Example

You can load the necessary JavaScript and CSS for this example from Yahoo's servers. Click here to load the YUI Dependency Configurator with all of this example's dependencies preconfigured.

YUI Logger Output:

Logger Console

INFO 530ms (+526) 5:06:49 AM:

LogReader instance0

LogReader initialized

INFO 4ms (+4) 5:06:49 AM:

example

As you interact with this example, relevant steps in the process will be logged here.

INFO 0ms (+0) 5:06:49 AM:

global

Logger initialized

Note: You are viewing this example in debug mode with logging enabled. This can significantly slow performance.

Reload with logging
and debugging disabled.

More Connection Manager Resources:

Copyright © 2009 Yahoo! Inc. All rights reserved.

Privacy Policy - Terms of Service - Copyright Policy - Job Openings