YUI Library Home

YUI Library Examples: Connection Manager: Connection Manager POST Transaction

Connection Manager: Connection Manager POST Transaction

To create a POST transaction using Connection Manager, you will need to construct a data string as the POST message. The following code example provides a step-by-step approach to creating a simple POST transaction.

Click "Send a POST Request" below to try it out, then read the description below to learn how to send POST data to the server using Connection Manager.

Using Connection Manager to Post Data and Receive the Server Response via HTTP POST

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 POST message

Construct an example of key-value string of username = anonymous and userid = 0:

1/*
2* Remember to encode the key-value string if and when
3* the string contains special characters.
4*/ 
5var postData = "username=anonymous&userid=0"
view plain | print | ?

The Callback Object

Create a callback object to handle the response and pass an array of values to success and failure as the argument.

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

Initiate the POST Transaction

Call YAHOO.util.Connect.asyncRequest to send the request to post.php, and the PHP script will return the a readable 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('POST', sUrl, callback, postData); 
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 377ms (+26) 4:00:43 AM:

LogReader instance0

LogReader initialized

INFO 351ms (+351) 4:00:43 AM:

example

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

INFO 0ms (+0) 4:00:43 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