Предисловие p: fileUpload не работает в IE 10

Question

Атрибут обновления и onComplete в p: fileUpload не работает в IE10. В IE 9 атрибут sizeLimit игнорируется. Кто-нибудь столкнулся с этой ситуацией.

Я пытался дозвониться р: remotecommand с помощью OnComplete атрибут р: 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 , Затем установите OnStart атрибут р: FileUpload к чему-то вроде следующего:

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

Я получил также проблемы, связанные с р: FileUpload после обновления до IE10. Возникли ошибки JavaScript («Синтаксическая ошибка в документе XML»).

Это помогло изменить X-UA-Compatible заголовок 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; 
}