I am trying to open file browser window for input type file, triggering on change on select box option. But it is not working. Any idea what is wrong and how to get it work? FWIW I tried to get an idea from http://jsfiddle.net/afxDC and that is for text field.
UPDATE:- I found this code works on FF 28.0, but not on chrome 33.0.1750.152 and Safari Version 7.0.3 (9537.75.14). So need to get it work on those browsers too
<html>
<head>
<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.0.js"></script>
<style type="text/css">
input[type=file] {
display:block;
height:0;
width:0;
}
</style>
</head>
<body>
<div class="item">
<select id="media-selector">
<option value=""></option>
<option value="image">Add image</option>
<option value="video">Add video</option>
</select>
<input type="file"/>
</div>
<script type="text/javascript">
$("#media-selector").change(function() {
$(this).parents(".item")
.find('input[type=file]')
.trigger('click');
});
</script>
</body>
</html>