IE 8 and IE 9 refuses to open the window file picker when the ajax uploader is used in a "bootstrap modal". It works on IE 10, Chrome, FF...
I couldn't make it work with jsfiddle, so where is the code sample:
<html>
<head>
<link rel="stylesheet" href="../bootstrap/css/bootstrap-min.css" />
<script src="../js/jquery-1.8.2.min.js" type="text/javascript"></script>
<script src="../js/SimpleAjaxUploader.min.js" type="text/javascript"></script>
<script src="../bootstrap/js/bootstrap-min.js" type="text/javascript"></script>
</head>
<body>
<!-- Button to trigger modal -->
<a href="#myModal" role="button" class="btn" data-toggle="modal">Launch modal</a>
<!-- Modal -->
<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<h3 id="myModalLabel">Modal</h3>
</div>
<div class="modal-body">
<div id="photo-space" style="width:60px; height:120px; border:2px solid">
<img id='photo' alt="No photo" style="width:60px; height:120px;"/>
</div>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
</div>
</div>
<script type="text/javascript">
$(function () {
var uploader = new ss.SimpleUpload({
button: 'photo-space', // HTML element used as upload button
url: '/EncAccess/CredentialImageUploadHandler.ashx', // URL of server-side upload handler
name: 'uploadfile', // Parameter name of the uploaded file
allowedExtensions: ['jpg', 'jpeg', 'png', 'gif'],
responseType: 'json',
onSubmit: function (filename, extension) {
var dd = "dfgdf";
},
onComplete: function (filename, response) {
if (!response) {
//alert(filename + 'upload failed');
return false;
}
$("#photo").attr('src', response.ImageUrl);
// do something with response...
}
});
});
$('#myModal').modal('show');
</script>
</body>
</html>