Большая проблема с расширением ExtJS FileUpload

Question

У меня есть проблема. У меня есть форма, которая имеет «fileuploadfield», но «по умолчанию» она появляется в форме, ввинченной !. Он появляется с двумя кнопками и двумя полями ввода, но один из них работает, а другой не работает:

Как вы можете видеть на картинке, только один, который работает в «серой один».

Это функция, построить этот пункт:

buildBrowseFoto : function() { 
    return { 
     xtype   : 'container', 
     layout   : 'column', 
     anchor   : '-10', 
     defaultType : 'container', 
     defaults  : { 
      width  : 300, 
      labelWidth : 80, 
      layout  : 'form' 
     }, 
     items   : [ 
     { 
      items  : { 
       xtype: 'fileuploadfield', 
       emptyText: '', 
       fieldLabel: 'Foto', 
       buttonText: 'Selecciona una foto...', 
       name: 'foto' 
      } 
     } 
     ] 
    }; 
} 

Это функция внутри класса, который расширяет FormPanel. Может быть, это кажется вам странным, но это так, как строится Джей Гарсиа, и я тоже: P.

Answer 1

Похож на проблему с CSS. Первое, что вам нужно сделать, это убедиться, что вы включили fileUploadField.css, который поставляется вместе с полем. Я вставить содержимое здесь:

.x-form-file-wrap { 
    position: relative; 
    height: 22px; 
} 
.x-form-file-wrap .x-form-file { 
    position: absolute; 
    right: 0; 
    -moz-opacity: 0; 
    filter:alpha(opacity: 0); 
    opacity: 0; 
    z-index: 2; 
    height: 22px; 
} 
.x-form-file-wrap .x-form-file-btn { 
    position: absolute; 
    right: 0; 
    z-index: 1; 
} 
.x-form-file-wrap .x-form-file-text { 
    position: absolute; 
    left: 0; 
    z-index: 3; 
    color: #777; 
} 

Если это не устранит проблему, вы должны иметь некоторые пользовательские CSS или что-то, что Мессинг форму. Попробуйте использовать FireBug и посмотрите на стили вокруг элемента и попробуйте отключить какие-либо пользовательские стили, которые вы случайно можете перенести, что должно быть там.