208 Part II: Applied Ajax^
type="text/javascript"></script>
<script type="text/javascript">
function handleResponse(response)
{
var responseOutput = document.getElementById("responseOutput");
responseOutput.innerHTML = response.responseText;
}function handleFailure()
{
alert("Sorry an error has occurred");
}function rate(form)
{
var URL = "http://ajaxref.com/ch3/setrating.php";
var callback = { success:handleResponse, failure: handleFailure, timeout: 5000 };YAHOO.util.Connect.setForm(form); /* serialize the contents of the form */
YAHOO.util.Connect.asyncRequest("POST", URL, callback);
}
YAHOO.util.Event.addListener("voteBtn","click",
function () { rate("ratingForm"); } );
</script>
</head>
<body>
<h3>How do you feel about Ajax?</h3>
<form action="http://ajaxref.com/ch3/setrating.php" name="ratingForm"
method="post" >
<em>Hate It - </em> [
<input type="radio" name="rating" value="1" /> 1
<input type="radio" name="rating" value="2" /> 2
<input type="radio" name="rating" value="3" /> 3
<input type="radio" name="rating" value="4" /> 4
<input type="radio" name="rating" value="5" /> 5
] <em> - Love It</em><br /><br />
<label>Comments:<br />
<textarea id="comment" name="comment" rows="5" cols="40"></textarea></label><br />
<input id="voteBtn" type="button" value="vote" />
</form>
<br /><br />
<div id="responseOutput"> </div>
</body>
</html>The example can be viewed online at http://ajaxref.com/ch5/yuirating.html.File Uploading with YUI
As alluded to earlier in the section, the YUI Connection Manager can handle file uploads. When
using the setForm() method, any occurrence of a file upload field using <input type=”file”>
will trigger the use of the iframe post technique to upload a file as used in the AjaxTCR library
and as discussed in Chapter 2. As a reminder, at the time of this writing, XHR objects have no
way to handle file uploads without browser modification. The handling of file uploads with YUI