• Primefaces的fileUpload组件使用


            最近在学习Primefaces(当然也是项目中需要用的)。在使用其fileUpload遇到了不小的困难,现总结一下供大家及我自己今后参考使用。

            1、首先是使用环境配置:正常的Primefaces开发环境就不多说了,网上多的很。说下专门用于fileUpload的几点。

    a. 进行web.xml配置:除了创建Primefaces时系统自动提供的东西外,需要在工程的WEF-INF/web.xml里加入以下几行内容:

        <filter>  
            <filter-name>PrimeFaces FileUpload Filter</filter-name>  
            <filter-class>org.primefaces.webapp.filter.FileUploadFilter</filter-class>  
        </filter>          
        <filter-mapping>  
            <filter-name>PrimeFaces FileUpload Filter</filter-name>  
            <servlet-name>Faces Servlet</servlet-name>  
        </filter-mapping>  
        <context-param>  
            <param-name>primefaces.THEME</param-name>  
            <param-value>marstor</param-value>  
        </context-param>  

            这个原文复制过去就行了,我一朋友在用的时候把

    <servlet-name>Faces Servlet</servlet-name>  

    里Faces Servlet两个单词首字母小写了,结果上传无法使用害我用了整半天时间检查。

    b. 必要的jar包准备  commons-fileupload-1.2.1.jar commons-io-2.0.1.jar (直接点进去可下载)。这两个文件根据配置不同有的需要放在WEF-INF/lib下一份,有的需要放在{tomctHome}/lib里一份(个人建议一个里面放一份,省得事多)。

    c.做完上面的东西后重启一下tomcat。

    d.编写fileUpload的代码,注意 mode 要advanced模式的(simple模式的也不好看,也不好调)。

    <p:fileUpload fileUploadListener="#{upload.fileUpload}" id="upLoad2" 
                                  auto="true"  label="导入"  update="RegisterInfo"  mode="advanced"
                                  style="text-align: center;  800px; height: 40px; " />

    e.后台正常编写就是了。。里面加个sout,看是不是能把东西打印出来。

               2、在做Primefaces时发现另一个东西,就是primefaces的组件可以通过调整实际页面的css来调整其显示效果。也就是我们可以选择部分显示组件而非全部显示组件。还以这个fileUpload组件为示例。正常的 auto="true"模式的组件显示效果如图:
    而我做出来效果如图:看,后面的那个灰的bar,和下面的白框都不见了。实际上我在这个页面的css里加入了如下内容:

    .ui-fileupload .start {
        display: none;
    }
    .ui-fileupload .cancel {
        display: none;
    }
    .ui-fileupload .progress {
        display: none;
    }
    
    
    .fileupload-content{
        display: none;
    }
    
    .fileupload-buttonbar{
        visibility: hidden;
    }
    
    .ui-corner-buttom{
        display: none;
    }
    
    .fileinput-button{
        visibility: visible;
    }

    说白了无论什么组件,实际执行到页面里就是一堆html代码。我们用火狐开发者分析这个组件的所以元素,可以看到这个组件的所以组成,然后用css把不想看到的东西屏蔽掉就OK了。

  • 相关阅读:
    React开发流程及认识
    Python整合AnaConda
    计算机显示器扩展方向调整
    python3 urlencode 和 urldecode 使用
    解决开启Vue项目缺少node_models包问题
    解决开启Vue项目缺少node_models包问题
    python中列表相加
    python炒鸡面试题
    Django中的CBV控制前后端分离模式
    selenuim使用总结
  • 原文地址:https://www.cnblogs.com/javawebsoa/p/3196562.html
Copyright © 2020-2023  润新知