AndroidAjax upload with ColdFusion
Apr 26
I've once wrote file upload with flash. But I'm thinking of the weak point of this program would be alright if users don't have flash player as well as using with GuestAccount. That's I need to consider how to solve this problem and want to do file upload with Ajax. Eventually, I can do it. Here is coding.
index.cfm
1<html>
2<head>
3<title>AJAX File Uploader</title>
4<invalidTag language="javascript" type="text/javascript">
5<!--
6function startUpload(){
7document.getElementById('f1_upload_process').style.visibility = 'visible';
8document.getElementById('f1_upload_form').style.visibility = 'hidden';
9return true;
10}
11
12function stopUpload(success){
13var result = '';
14if (success == 1){
15result = '<span class="msg">The file was uploaded successfully!<\/span><br/><br/>';
16}
17else {
18result = '<span class="emsg">There was an error during file upload!<\/span><br/><br/>';
19}
20document.getElementById('f1_upload_process').style.visibility = 'hidden';
21document.getElementById('f1_upload_form').innerHTML = result + '<label>File: <input name="myfile" type="file" size="30" /><\/label><label><input type="submit" name="submitBtn" class="sbtn" value="Upload" /><\/label>';
22document.getElementById('f1_upload_form').style.visibility = 'visible';
23return true;
24}
25//-->
26</script>
27</head>
28
29<body>
30<form action="upload.cfm" method="post" enctype="multipart/form-data" target="upload_target" onsubmit="startUpload();" >
31<p id="f1_upload_process">Loading...<br/><img src="loader.gif" /><br/></p>
32<p id="f1_upload_form" align="center"><br/>
33<label>File:
34<input name="myfile" type="file" size="30" />
35</label>
36<label>
37<input type="submit" name="submitBtn" value="Upload" />
38</label>
39</p>
40
41<invalidTag id="upload_target" name="upload_target" src="#" style="width:0;height:0;border:0px solid #fff;"></iframe>
42</form>
43</body>
2<head>
3<title>AJAX File Uploader</title>
4<invalidTag language="javascript" type="text/javascript">
5<!--
6function startUpload(){
7document.getElementById('f1_upload_process').style.visibility = 'visible';
8document.getElementById('f1_upload_form').style.visibility = 'hidden';
9return true;
10}
11
12function stopUpload(success){
13var result = '';
14if (success == 1){
15result = '<span class="msg">The file was uploaded successfully!<\/span><br/><br/>';
16}
17else {
18result = '<span class="emsg">There was an error during file upload!<\/span><br/><br/>';
19}
20document.getElementById('f1_upload_process').style.visibility = 'hidden';
21document.getElementById('f1_upload_form').innerHTML = result + '<label>File: <input name="myfile" type="file" size="30" /><\/label><label><input type="submit" name="submitBtn" class="sbtn" value="Upload" /><\/label>';
22document.getElementById('f1_upload_form').style.visibility = 'visible';
23return true;
24}
25//-->
26</script>
27</head>
28
29<body>
30<form action="upload.cfm" method="post" enctype="multipart/form-data" target="upload_target" onsubmit="startUpload();" >
31<p id="f1_upload_process">Loading...<br/><img src="loader.gif" /><br/></p>
32<p id="f1_upload_form" align="center"><br/>
33<label>File:
34<input name="myfile" type="file" size="30" />
35</label>
36<label>
37<input type="submit" name="submitBtn" value="Upload" />
38</label>
39</p>
40
41<invalidTag id="upload_target" name="upload_target" src="#" style="width:0;height:0;border:0px solid #fff;"></iframe>
42</form>
43</body>
Upload.cfm
1<cffile action="UPLOAD" filefield="myfile" destination="D:/test/ajaxupload/files/" nameconflict="MAKEUNIQUE">
2<cfset myfile = file.serverfile>
3
4<invalidTag language="javascript" type="text/javascript">window.top.window.stopUpload('1');</script>
How? It's easy thought, isn't it?2<cfset myfile = file.serverfile>
3
4<invalidTag language="javascript" type="text/javascript">window.top.window.stopUpload('1');</script>
Best Credit to : http://www.ajaxf1.com/download.html?item=12
Top of Page