JSFiddle - React, Tailwind, and code Playground
HTML
<form action="/audio/upload/" enctype="multipart/form-data" method="POST" id="new-audio" class="ajax-form">
<fieldset>
<div id="div_audio"><label for="audio">Upload an Audio from your drive</label><br>
<input type="file" id="id_audio" name="audio"></div>
<input type="submit" value="Share">
</fieldset>
</form>
<br />
<br />
<div id="dump"></div>
JavaScript
$(document).ready(function() {
$('form#new-audio').live('submit', function (e) {
e.preventDefault();
var $currentForm = $(this);
var audioFiles = $currentForm.attr("elements").audio.files;
//$("#dump").text(audioFiles);
var errorPresent = false;
$.each(audioFiles, function(index, file) {
if (file.type.toLowerCase().search("image") < 0 ) {
$("#dump").prepend("Uploaded file must be of type 'mp3'<br />");
errorPresent = true;
return;
}
});
if (!errorPresent) {
$("#dump").prepend("Wohoo we got a winner<br />");
}
return false;
});
});