[eluser]nuttynibbles[/eluser]
hello, im doing a function to upload photo. i would like to use ajax for user to preview the photo before submitting the form. so basically i want the user to click onto preview button where it will use ajax to preview the img to the user by saving the img file in a temp folder.
here is my code for the html:
Code:
<form name="frmregister" method="post" action="http://url/codeigniter/upload/do_upload" enctype="multipart/form-data">
<input type="hidden" name="post" value="1" />
Upload a photo: <input type="file" name="file" id="file" /><input type="submit" name="preview" value="preview">
<input class="button" type="submit" name="upload" value="upload" />
</form>
i found a ajax file on CI forum. it looks like this:
Code:
var ajaxPost = function() {
// Get request object
function getRequest() {
if (window.XMLHttpRequest)
return new XMLHttpRequest();
else if (window.ActiveXObject)
return new ActiveXObject("Microsoft.XMLHTTP");
else
alert('Ajax not supported');
return null;
}
// Basic callback - could add error handler if you wanted
function handleChange(req, callback) {
if(req.readyState == 4) {
if (req.status == 200) {
if (callback)
callback(req.responseText);
}
else {
alert("Ajax request failed.");
}
}
}
// Create query string from json object
function handleParams(params) {
if(!params) {
return null;
}
else {
var encoded = "";
for (var field in params) {
fieldval = params[field];
encoded += field + '=' + fieldval + '&';
}
return encoded;
}
}
// Combine it all in one pretty interface
return function(uri, callback, data) {
var request = getRequest();
request.open('POST', uri, true);
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
request.onreadystatechange = function() { handleChange(request, callback) };
request.send(handleParams(data));
return request;
};
}();
can someone show me how to go about doing this. tks
