Primefaces p：fileUpload在IE 10中不起作用

Question

p：fileUpload中的更新属性和onComplete在IE10中不起作用。在IE 9中sizeLimit属性被忽略。有没有人遇到过这种情况。

我已经打过电话号码：通过使用页上的onComplete属性remotecommand：fileUoload但它看起来像连的onComplete并不在IE 10

<h:form id="file" enctype="multipart/form-data"> 
     <p:outputLabel value="Test........"></p:outputLabel> 
     <p:fileUpload label="Browse..." description="Select PDF file" 
      auto="true" sizeLimit="500000" 
      oncomplete="refreshData()" 
      onstart="alert('test');" mode="advanced" 
      fileUploadListener="#{fileUpload.handleFileUpload}" 
      allowTypes="/(\.|\/)(pdf|png)$/"> 

     </p:fileUpload> 
     <p:inputText value="#{fileUpload.test}" id="test" /> 
     <p:remoteCommand name="refreshData" action="#{fileUpload.setData}" 
      update="test"></p:remoteCommand> 
    </h:form> 

Answer 1

工作终于明白它在primefaces的错误。

http://forum.primefaces.org/viewtopic.php?f=3&t=28860#p94845

http://code.google.com/p/primefaces/issues/detail?id=5355

固定在：

TargetVersion-4.0
TargetVersion-3.5.9

Answer 2

使用此CSS解决方法。我从the jQuery FileUpload component commit得出了这个问题。

.fileinput-button input { 
    -moz-transform : none !important; 
    border : none !important; 
    border-width : 0 !important; 
    transform : translate(-300px, 0) scale(4) !important; 
    font-size : 23px !important; 
} 
* + html .fileinput-button { 
    line-height : none !important; 
    padding : 2px 15px !important; 
} 

Answer 3

这似乎是绝对位置的问题。将其更改为固定。它的工作原理就在我身边：

.fileupload-buttonbar .ui-button input { 
    ... 
    position       : fixed; 
    ... 
} 

Answer 4

这是固定在新的4.0版本Primefaces，但是如果你仍然对旧版本Primefaces，你可能还需要一个解决方法。

我能够使用的OnStart属性，它确实还工作在IE 10

创建包含被更新为从fileUploadListener调用的方法的一部分值的隐藏字段文件上传后更新。升级到IE10之后的FileUpload：在p的的OnStart属性然后设置：文件上传到类似以下内容：

function checkUpload() { 

    //this should call a p:remoteCommand that refreshes your hidden value 
    refreshHiddenValue(); 

    var hiddenFieldValue = $('#hiddenFieldId').val(); 
    if(hiddenFieldValue) { 
     //this should call a p:remoteCommand that refreshes the 
     //sections you want refreshed after the upload has finished 
     refreshSections(); 
    } 
    else { 
     setTimeout(checkUpload, 1000); 
    } 
} 

Answer 5

我也有问题页。 JavaScript错误开始发生（'XML文档中的语法错误'）。

它有助于所述X-UA-兼容头更改为IE = EmulateIE9：

<h:head> 
    <f:facet name="first"> 
     <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9,chrome=1" /> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    </f:facet> 
<h:head> 

Answer 6

我不得不面对此问题与PF 5.1从PF 3迁移，由于this post我分辨：

这是生成的HTML代码：

<div class="ui-fileupload-buttonbar ui-widget-header ui-corner-top"> 
    <span class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-left ui-fileupload-choose" > 
     <span class="ui-button-icon-left ui-icon ui-c ui-icon-plusthick"></span> 
     <span class="ui-button-text ui-c">upload</span> 
     <input name="upload" type="file"> 
    </span> 
</div> 

而这其中解决了这个问题的CSS：

.ui-fileupload-buttonbar .ui-fileupload-choose input 
{ 
    position:absolute; 
    top:0; 
    right:0; 
    margin:0; 
    border:solid transparent; 
    border-width:0 0 1px 1px; 
    opacity:0; 
    filter:alpha(opacity=0); 
    -o-transform:translate(250px, -50px) scale(1); 
    direction:ltr; 
    cursor:pointer; 
    z-index:5000; 
    width:100%; 
    height: 20px;  
} 

.ui-button { 
    position: relative; 
    overflow: hidden; 
} 
.ui-button input[type=file] { 
    position: absolute; 
    top: 0; 
    right: 0; 
    min-width: 100%; 
    min-height: 100%; 
    font-size: 100px; 
    text-align: right; 
    filter: alpha(opacity=0); 
    opacity: 0; 
    outline: none; 
    background: white; 
    cursor: inherit; 
    display: block; 
}