valums.com/ajax-upload
プラグインを使用しています。問題は、ファイルを選択するとすぐにアップロードが開始されることです。他のボタンをクリックしてアップロードを開始したいので、ユーザーは必要に応じて値を変更できます。
HTML:
<div id="upload" ><span>Upload File<span></div>
<input type="button" name="submit" id="submit" value="Submit" />
<span id="status" ></span><ul id="files" ></ul>
jQuery:
$(function(){
var btnUpload = $('#upload');
var status = $('#status');
new AjaxUpload(btnUpload, {
action: 'upload-file.php',
name: 'uploadfile',
autoSubmit: false,
onSubmit: function(file, ext){
// if (! (ext && /^(pdf)$/.test(ext))){
if (!(ext && /^(jpg|png|jpeg|gif|pdf)$/.test(ext))) {
// extension is not allowed
status.text('Only JPG, PNG or GIF files are allowed');
return false;
}
upload.setData({'example_key': 'value'});
},
onComplete: function(file, response) {
//On completion clear the status
status.text('');
//Add uploaded file to list
if (response === "success") {
$('<li></li>').appendTo('#files').html('<img src="./uploads/'+file+'" alt="" /><br />'+file).addClass('success');
}
else {
$('<li></li>').appendTo('#files').text(file).addClass('error');
}
}
});
$("#submit").click(); ////dont know how to do it.
});