| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <title>Excel Preview</title>
- <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
- <link rel="stylesheet" href="node_modules/bootstrap-table/dist/bootstrap-table.min.css">
- <link href="node_modules/bootstrap-fileinput/dist/css/fileinput.min.css" rel="stylesheet" type="text/css" />
- <link rel="stylesheet" href="css/excel-preview.css">
- </head>
- <body>
- <div class="container">
- <section>
- <div class="content">
- <input type="file" name="file" id="file" class="file">
- <div id="excelTable"></div>
- <div id="kartik-file-errors"></div>
- </div>
- </section>
- </div>
- <script src="node_modules/jquery/dist/jquery.min.js" type="text/javascript"></script>
- <script src="node_modules/bootstrap/dist/js/bootstrap.min.js" type="text/javascript"></script>
- <script src="node_modules/bootstrap-table/dist/bootstrap-table.min.js" type="text/javascript"></script>
- <script src="node_modules/bootstrap-table/dist/locale/bootstrap-table-zh-CN.min.js" type="text/javascript"></script>
- <script src="node_modules/xlsx-style/dist/xlsx.full.min.js" type="text/javascript"></script>
- <script src="node_modules/bootstrap-fileinput/dist/js/fileinput.js" type="text/javascript"></script>
- <script src="node_modules/bootstrap-fileinput/js/locales/zh.js" type="text/javascript"></script>
- <!-- <script src="js/dist/excel-preview.min.js"></script>-->
- <script src="js/src/util.js" type="text/javascript" ></script>
- <script src="js/src/excel-preview.js" type="text/javascript" ></script>
- <script type="text/javascript">
- $("#excelTable").excelPreview({
- "overwriteInitial":true,
- "initialPreviewAsData":true,
- "browseLabel":"瀏覽 - browseLabel",
- "cancelLabel":"取消 - cancelLabel",
- "showRemove":false,
- "showUpload":false,
- "showCancel":false,
- "dropZoneEnabled":true,
- "fileActionSettings":{"showRemove":true,"showDrag":false},
- "allowedFileExtensions":["xlsx","xls"],
- "browseOnZoneClick":true,
- "msgPlaceholder":"選擇檔案 - msgPlaceholder"});
- $('[name=file]').on('excel-data-change', function () {
- console.log($(this).data('excel-data'));
- })
- </script>
- </body>
- </html>
|
