Skip to content

Instantly share code, notes, and snippets.

@sp3c73r2038

sp3c73r2038/demo.html

Created March 24, 2011 10:31
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save sp3c73r2038/884850 to your computer and use it in GitHub Desktop.
Save sp3c73r2038/884850 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
demo.html
<html>
<head>
<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="js/jquery.validate.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.7.custom.min.js"></script>
<script type="text/javascript" src="js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="js/date.format.js"></script>
<script type="text/javascript" src="js/browser.detection.js"></script>
<link type="text/css" href="css/custom-theme/jquery-ui-1.8.7.custom.css" rel="stylesheet" />
<link type="text/css" href="css/demo_page.css" rel="stylesheet" />
<link type="text/css" href="css/demo_table.css" rel="stylesheet" />
<link type="text/css" href="css/demo_table_jui.css" rel="stylesheet" />
<meta content="text/html chartset='utf-8'">
<style>
* {
font-size: 12px;
}
.hidden{
display:none;
}
#file_container{
border:1px solid black;
padding:20px;
}
</style>
<script type="text/javascript">
var file_count = 0;
var removeFunction = function(id){
$("#file_upload_"+id).remove();
$("#fileInfo_"+id).fadeOut().remove();
return false;
}
var clickFunction = function(){
var newFile = $('<input id="file_upload" class="original_file" type="file" multiple="" onchange="clickFunction()"/>');
newFile.insertBefore('#file_upload');
var file = $(".original_file:eq(1)");
var fileName = file.attr('value');
var list = file.attr('files');
files = list.files;
return true;
var fileInfo = $('<div id="fileInfo_'+ file_count +'" class="fileInfo">'+ fileName +'<a href="#" onclick="removeFunction('+ file_count +')">remove</a></div>');
fileInfo.appendTo('#file_container');
file.attr("id", "file_upload_"+file_count);
file.removeClass("original_file");
file.addClass("files");
file.addClass("hidden");
file_count++;
file.appendTo($("#form"));
// $("#"+id).trigger('click');
// $("#"+id).click();
};
$(function(){
$("#file_upload").bind('change', clickFunction);
});
</script>
</head>
<body>
<!-- <button id="add_upload">select</button> -->
<form>
<input id="file_upload" class="original_file" type="file" />
</form>
<div id="file_container">
</div>
<form action="upload.php" id="form">
</form>
<button id="btn_submit">upload</button>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment