zoukankan      html  css  js  c++  java
  • 无刷新上传解析csv文件

     前阵子工作中用到,贴上代码,仅保留上传有关的代码,发现code其实很少。

    上传页面html/js
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head>
    <title></title>
    <script type="text/javascript">
    function FinishUpload(filePath) {
    document.getElementById(
    "uploadForm").reset();
    if (!filePath) {
    alert(
    "Import Failed!");
    }
    else {
    alert(
    "Imported Successfully to " + decodeURIComponent(filePath) + "!");

    }
    }

    function UploadFile() {
    var arr = document.getElementById("txtFile").value.split('.');
    var fileType = arr[arr.length - 1];
    if (fileType.toLowerCase().indexOf("csv") < 0) {
    document.getElementById(
    "uploadForm").reset();
    alert(
    "Please select a csv file.");
    return false;
    }

    document.getElementById(
    "uploadForm").encoding = "multipart/form-data";
    document.getElementById(
    "uploadForm").submit();
    }

    function ResetFile(file) {
    var tmpForm = document.createElement('form');
    file.parentNode.insertBefore(tmpForm, file);
    tmpForm.appendChild(file);
    tmpForm.reset();
    tmpForm.removeNode(
    false);
    }
    </script>
    </head>
    <body>
    <form id="uploadForm" name="uploadForm" action="Upload.ashx" method="post" target="hidIframe" enctype="multipart/form-data">
    <table cellpadding='0' cellspacing='0' style="100%;height:100%;border-collapse:collapse;" border="0" >
    <tr>
    <td>
    <input id="txtFile" name="txtFile" type="file" style="border:solid 1px Gray;" />
    <iframe name="hidIframe" id="hidIframe" style="display:none;" ></iframe>
    </td>
    </tr>

    <tr>
    <td>
    <input type="button" id="btnImportOK" value="Upload" onclick="UploadFile();" />
    <input type="button" id="btnImportCancel" onclick="ResetFile(document.getElementById('txtFile'))" value="Reset"/>
    </td>
    </tr>
    </table>
    </form>
    </body>
    </html>
    处理文件上传的c#code
    if (context.Request.Files.Count > 0)
    {
    HttpPostedFile file
    = context.Request.Files[0];
    if (file.ContentLength > 0)
    {
    string title = string.Empty;
    title
    = DateTime.Now.ToString("yyyyMMddHHmmss") + "_" + Path.GetFileName(file.FileName);
    string path = "./Upload/" + title;
    path
    = System.Web.HttpContext.Current.Server.MapPath(path);
    file.SaveAs(path);
    context.Response.Write(
    "<script>window.parent.FinishUpload('" + HttpUtility.UrlEncode(path) + "');</script>");
    }
    }
    else
    {
    context.Response.Write(
    "<script>window.parent.FinishUpload('');</script>");
    }

      做到无刷新,基本原理就是:通过表单提交到iframe里,从而使刷新发生在iframe里。form设置action指向处理上传的文件,target指向iframe。上传操作的结果可以返回到iframe里,调用父对象的FinishUpload方法显示是否上传成功。所以在AJAX未流行时,常用这种方法来伪装未刷新的效果,现在仍然可以使用。

    要注意的是:

    1. enctype="multipart/form-data"不可少,enctype默认编码是“application/x-www-form-urlencoded”,设置enctype="multipart/form-data",用于二进制方式上传文件。
    2. 为防止文件名乱码,防止乱七八糟字符URL传递中出现问题,返回文件名到前台时进行HttpUtility.UrlEncode,在前台JS中取文件名时进行decodeURIComponent。
    3. 重置文件选择框时,要把文件选择框临时插入到临时表单,通过表单的reset方法重置。

    顺便贴上解析上传的csv文件的code

    解析csv文件
    private DataTable ImportDataTable(string filepath)
    {
    DataTable mydt
    = new DataTable("myTableName");
    mydt.Columns.Add(
    "Data ID", System.Type.GetType("System.String"));
    mydt.Columns.Add(
    "Field Name", System.Type.GetType("System.String"));
    mydt.Columns.Add(
    "New Value", System.Type.GetType("System.String"));
    DataRow mydr;
    using (System.IO.StreamReader mysr = new System.IO.StreamReader(filepath))
    {
    int data;
    char current;
    StringBuilder text
    = new StringBuilder();

    IDictionary
    <int, List<string>> results = new Dictionary<int, List<string>>();
    bool isInYinHao = false; ;
    int lineId = 1;
    int index = 0;
    while (true)
    {
    data
    = mysr.Read();
    if (data != -1)
    {
    current
    = (char)data;
    if (current == '"')
    {
    if (isInYinHao)
    {
    isInYinHao
    = false;
    }
    else
    {
    if (index > 0)
    {
    text.Append(current);
    }

    isInYinHao
    = true;
    }
    }
    else if (current == ',')
    {
    if (isInYinHao)
    {
    text.Append(current);
    }
    else
    {

    SaveResult(results, lineId, text);
    index
    = 0;
    continue;
    }
    }
    else if (current == '\r')
    {
    if (isInYinHao)
    {
    text.Append(current);
    }
    }
    else if (current == '\n')
    {
    if (isInYinHao)
    {
    text.Append(current);
    }
    else
    {
    SaveResult(results, lineId, text);
    index
    = 0;
    lineId
    ++;
    continue;
    }
    }
    else if (current == '\0')
    {
    }
    else
    {
    text.Append(current);
    }

    index
    ++;
    }
    else
    {
    //Read to file end.
    SaveResult(results, lineId, text);
    break;
    }
    }

    foreach (int id in results.Keys)
    {
    mydr
    = mydt.NewRow();
    for (int i = 0; i < results[id].Count; i++)
    {
    if (i > 2)
    {
    break;
    }

    mydr[i]
    = results[id][i];
    }

    mydt.Rows.Add(mydr);
    }

    }

    return mydt;
    }

    private void SaveResult(IDictionary<int, List<string>> results, int lineId, StringBuilder text)
    {
    if (!results.ContainsKey(lineId))
    {
    results.Add(lineId,
    new List<string>());
    }

    results[lineId].Add(text.ToString());
    text.Remove(
    0, text.Length);
    }

    点击下载

  • 相关阅读:
    我觉得总结的不错的entityFramework
    vs2013引入com组件后,发布时如何提取出dll文件
    win10创建扩展分区
    web.config配置
    mysql时间增加一年
    json介绍
    phpcms列表分页ajax加载更多
    phpcms批量更新内容页只更新一点就返回问题
    phpcms不能批量更新栏目页和内容页
    iis设置默认文档,提示web.config配置xml格式不正确
  • 原文地址:https://www.cnblogs.com/Leo_wl/p/1765008.html
Copyright © 2011-2022 走看看