calling Valums Ajax uploader from other DOM element
- by Marc
I'm facing a problem with the valums Ajax File upload.
Since the plugin is working perfectly after a few modifications on the server side, I cannot implement a specific behavior.
My DOM is composed with an input file plus the container to instantiate the fileuploader buttons.
What I want is to be able to fire the fileuploader plugins when clicking on the input:file[name="upload-file"].
...
<div id="upload-accepted">
<fieldset>
<label for="upload-file">Select a file:</label>
<input type="file" name="upload-file" id="upload-file"/>
<noscript>
<p>Please enable JavaScript to use file uploader.</p>
</noscript>
</fieldset>
<div id="upload-container">
</div>
</div>
...
<script type="text/javascript">
$(function() {
var uploader = new qq.FileUploader({
action: '/file-upload',
element: document.getElementById('upload-container'),
onSubmit: function(id, filename){...},
onComplete: function(id, fileName, responseJSON){...}
});
});
</script>
I have tried to add the following on the script but it don't works
$("#upload-file").live('change', function(event) {
event.preventDefault();
$('.qq-upload-button').trigger('click');
return false;
});
Any clues?
Thanks in advance!
