Struts2SH整合uploadify实现文件上传《按钮中文解决》

Struts2SH整合uploadify实现文件上传《按钮中文解决》

Admin
2011年10月18日

来源于：http://www.mysjtu.com/page/M0/S609/609473.html

1、官方下载jquery.uploadify解压后放到项目目次下，如下目次进行页面加载

    <link  href="/xgrptwo/inspect/uploadify/uploadify.css"  rel="stylesheet" type="text/css"/>
    
    <script type="text/javascript" src="/xgrptwo/inspect/uploadify/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="/xgrptwo/inspect/uploadify/swfobject.js"></script>
    <script type="text/javascript" src="/xgrptwo/inspect/uploadify/jquery.uploadify.v2.1.4.min.js"></script>

重视路径题目，全部应用的是绝对路径哦，不然可以因为action跳转之类的题目，js没有加载

<script type="text/javascript"><!--

   ￥（document）.ready（function（）{
   
    ￥（"＃uploadTest"）.uploadify（{
     ""uploader""       : ""/xgrptwo/inspect/uploadify/uploadify.swf""，
     ""script""         : ""/inspect/attChenMentInfoAction!add.action""，
     ""method""         : ""post""，
     ""cancelImg""      : ""/xgrptwo/inspect/uploadify/cancel.png""，
     ""fileDataName""   : ""myFile""，
     ""queueID""        : ""fileQueue""，
     ""folder""         : ""/temp""，
     ""auto""           : true，
     ""multi""          : false，
     ""width""          : 50，
     ""height""         : 30，
     ""buttonImg""      : ""/xgrptwo/inspect/uploadify/up.png""，
     ""wmode""          : ""transparent""，
     ""simUploadLimit"" : 2，
     ""sizeLimit""      : 1024000，//文件大小把握，单位是byte
     ""queueSizeLimit"" : 999，
     ""fileDesc""       : ""rar文件或zip文件doc文件""，
     ""fileExt""        : ""*.rar;*.zip;*.doc""，
     onSelect         :function（e，queueID，fileObj）{
         //取到filename的值设置给input框
           var filename = ￥（"＃name"）.attr（"value"）;
           if（filename==""）{              
               ￥（"＃name"）.attr（"value"，fileObj.name）;
               //输入框只读
               //￥（"＃filename"）.attr（"disabled"，"disabled"）;
          } 
     }，
     onCancel          :function（event，queueID，fileObj，data）{

         //￥（"input[name="""+fileObj.name+"""]"）.remove（）;
         //没有文件选中状况，清空filename输入框的值
         if（data.fileCount==0）{
         //输入框内容清空
             ￥（"＃name"）.removeAttr（"value"）;
         }
     }，
     onComplete        :function（event，queueID，fileObj，data）{
        //将按钮可用
         ￥（"＃tijiao"）.removeAttr（"disabled"）;
     }，
     onInit            :function（）{

         //初始化一些器材、没有选中文件并且提交的景象下按钮不成用
         ￥（"＃tijiao"）.attr（{"disabled":"disabled"}）;    
     }
    }）;
   }）;
// -->
</script>

上方是页面写的js脚本进行调用和一些初始化，里面的参数网上有很多详解

       <div id="fileQueue"></div>
        <input type="file" name="myFile" id="uploadTest" >
        <a class="link4" href="javascript:￥（""＃uploadTest""）.uploadifyUpload（）">点击提交</a>
        <a class="link4" href="javascript:￥（""＃uploadTest""）.uploadifyClearQueue（）">作废上传</a>

这段用户上传文件的input框和进度条显示区域以及一些按钮操纵连接，当然这些连接其实是可以不要的。。。，只要你看懂了前面，以上是最根蒂根基的，也是必须的哦

""auto""           : true，
 ""multi""          : false，

2，可能大师上传之后会碰到中文题目，这个的原因可能是jsp页面应用的编码和struts2设置的编号以及uploadify所应用的编码不一致导致的，uploadify发送应用的编码是"UTF-8"，都应用这个就没事了

3、笔者这里因项目应用的同一编码是GBK，所有呈现了乱码，尚没有解决，这里我应用了一个办法解决，可供参考

<form id="upload" action="/inspect/attChenMentInfoAction!copyFileToDisk.action" method="post"  name="upload">       
            <table align="center" border="1" width="90％" style="border-collapse: collapse;margin-top:5px;display:block" bordercolor="＃D7D7D7" cellpadding="0" cellspacing="0" id="lishijilu">
                <tr class="tab_title_bg">
                    <td>材料名称</td><td><input id="name" name="name" type="text" size="50"></input><font color="＃ff0000"><span>*</span></font></td>
                    <td>材料申明</td><td><input id="filecaption" name="filecaption" type="text" size="50"></input><font color="＃ff0000"><span>*</span></font></td>               
                </tr>
                <tr>
                    <td>&nbsp;</td><td colspan="3">
                        <input id="tijiao" name="tijiao" type="submit" value="提交" οnclick="return checkForm（）;"></input>
                    </td>                            
                </tr>
            </table>
        </form>

 看懂了吗，即每次上传之后，我把上传的文件名设置进我的一个input框，那么用户可以本身去设置这个文件一些其他信息了，很是类似163邮箱的上传功能哦。

 其实就是俩次提交，第一次提交只是将文件从客户端到办事器，同时保存到办事器某个目次下，第二次form提交就是到这个目次下去找文件，同时保存到正式目次并且记录到数据库

4、最后来看struts2的action了

public String add（）
{
    System.out.println（fileName+"---->>>"）;
   String newFileName = new Date（）.getTime（） + getExtention（fileName）;

   File newFile = new File（ServletActionContext.getServletContext（）
     .getRealPath（"/upload"）+"/"+fileName）;
    // + "/" + newFileName）;
   System.out.println（"copy文件"）;
   upload（myFile， newFile）;
   try {
    ServletActionContext.getResponse（）.getWriter（）.write（0）;
} catch （IOException e） {
    // TODO Auto-generated catch block
    e.printStackTrace（）;
}
   return "success";
}



private static void upload（File src， File dst） {
   try {
    InputStream in = null;
    OutputStream out = null;
    try {
     in = new BufferedInputStream（new FileInputStream（src），
       BUFFER_SIZE）;
     out = new BufferedOutputStream（new FileOutputStream（dst），
       BUFFER_SIZE）;
     byte[] buffer = new byte[BUFFER_SIZE];
     while （in.read（buffer） > 0）
     {
      out.write（buffer）;
     }
    } 
    finally
    {
     if （null != in）
     {
      in.close（）;
     }
     if （null != out）
     {
      out.close（）;
     }
    }
   }
   catch （Exception e） 
   {
    e.printStackTrace（）;
   }
}


private static String getExtention（String fileName） {
   int pos = fileName.lastIndexOf（"."）;

   return fileName.substring（pos）;
}

5、如许就将文件保存到办事器/upload目次下了，当然实际项目中可以同时要向数据库写数据拉，以上供参考

 

6 、上传选择文件中文题目，据说是这个独一的毛病，  解决规划是

　　""width""          : 50，
     ""height""         : 30，
     ""buttonImg""      : ""/xgrptwo/inspect/uploadify/up.png""，
     ""wmode""          : ""transparent""，

分别是选择文件那个按钮的宽度、高度、对应的图片。。。。那么你可以本身选择图片，那么图片上就可以有中文了。

 

7、因实际项目隐私题目，所有项目组代码没有供给，有需求的可留言，我会一一答复的，写得不好的处所请谅解，小菜鸟的小笔记本罢了。。。。。

 

下一章：struts2实现文件下载和应用struts2的pg标签进行数据分页