<script src="js/code_js.js" type="text/javascript"></script> <script src="js/code_js1.js" type="text/javascript"></script> <script type="text/javascript">$(document).ready(function() { $('#upload_container').submit(function(e) { if($('#userImage').val()) { e.preventDefault(); $('#loader-icon').show(); $(this).ajaxSubmit({ target: '#targetLayer', beforeSubmit: function() { $("#progress-bar").width('0%'); }, uploadProgress: function (event, position, total, percentComplete){ $("#progress-bar").width(percentComplete + '%'); $("#progress-bar").html('<div id="progress-status">' + percentComplete +' %</div>') }, success:function (){ $('#loader-icon').hide(); }, resetForm: true }); return false; } });}); </script><center><form id="upload_container" action="upload.php" method="post"><div><label>Upload Image File:</label><input name="userImage" id="userImage" type="file" class="demoInputBox" /></div><br /><div><input type="submit" id="btnSubmit" value="Submit" class="btnSubmit" /></div><div id="progress-div"><div id="progress-bar"></div></div><div id="targetLayer"></div></form><div id="loader-icon" style="display:none;"><img src="loading.gif" /></div></center>