YUI Library Home

Site Search (YDN & YUIBlog):

# 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.

View example in new window.

## 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:

<script src="yahoo.js"></script> <script src="event.js"></script> <script src="connection.js"></script>

### Assemble the POST message

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

/* * Remember to encode the key-value string if and when * the string contains special characters. */ var postData = "username=anonymous&userid=0";

### The Callback Object

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

var handleSuccess = function(o){ if(o.responseText !== undefined){ div.innerHTML = "Transaction id: " + o.tId; div.innerHTML += "HTTP status: " + o.status; div.innerHTML += "Status code message: " + o.statusText; div.innerHTML += "<li>HTTP headers: <ul>" + o.getAllResponseHeaders + "</ul></li>"; div.innerHTML += "PHP response: " + o.responseText; div.innerHTML += "Argument object: " + o.argument; } } var callback = { success:handleSuccess, failure: handleFailure, argument: ['foo','bar'] };

### 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.

var request = YAHOO.util.Connect.asyncRequest('POST', sUrl, callback, postData);

## 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:

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

Reload with logging
and debugging disabled.

### Connection Manager Examples:

- Connection Manager GET Transaction
- Connection Manager POST Transaction
- Connection Manager Transaction Timeout
- Retrieving a Yahoo! Weather RSS Feed
- Cross-Domain Transactions with Connection Manager
- Subscribing to Connection Manager Global Events
- Subscribing to Connection Manager's Custom Events via the Callback Object
- Connection Manager assisted image crop (included with examples for ImageCropper Control (beta))
- Dynamically Loading Node Data (included with examples for TreeView Control)
- Editor Data Post with Connection Manager (included with examples for Rich Text Editor)
- Simple Application (included with examples for Layout Manager)

### More Connection Manager Resources:

- User's Guide (external)
- API Documentation
- Cheat Sheet PDF (external)

Copyright © 2009 Yahoo! Inc. All rights reserved.

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