Hi,

I'm using this on single file input field in aform which works fine, what is the best best way to edit code to use on multiple file fields in the same form which is what I am trying to achieve now .

javascript:

Code:
<script>
    function PreviewImage() {
        var oFReader = new FileReader();
        oFReader.readAsDataURL(document.getElementById("uploadImage").files[0]);

        oFReader.onload = function (oFREvent) {
            document.getElementById("uploadPreview").src = oFREvent.target.result;
			document.getElementById('uploadPreview-container').style.display='block';
        };
    };
	function ResetImage() {
			document.getElementById('uploadPreview-container').style.display='none';
			document.getElementById('uploadImage').value = '';
	};

</script>

CSS:

Code:
<style>
#uploadPreview {
	width:100px;
} 
#uploadPreview-container {
	display:none;
    position: relative;
    width: 100px;
}
#uploadReset {
    position: absolute;
    top: 0;
    right: 0;
}
</style>
HTML

Code:
    <div id="uploadPreview-container">
    <img id="uploadPreview"/>
    <div id="uploadReset"><a href="javascript:void(0)" onclick="ResetImage()" title="Reset Image Upload">RESET</a></div>
    </div>
    <div><input id="uploadImage" type="file" name="myPhoto" data-max-size="248" onChange="PreviewImage();" /></div>