Запустите элемент управления AsyncFileUpload через кнопку - PullRequest
4 голосов
/ 18 декабря 2011

Я хочу запустить элемент управления AsnyncFileUpload через другой элемент управления на странице.

Я использовал AsyncfileUpload из инструментария ASP.NET AJAX и скрыл его через JQuery.И помещает кнопку рядом с ним.Даже когда я нажимаю эту кнопку и выбираю файл, я хочу запустить AsycnFileUpload и загрузить файлы.

Я написал большую часть кода, но при выборе файла я получаю ошибку Javascript.


(ОШИБКА: доступ запрещен;

МЕСТО: setTimeout(function () { mainForm.submit(); //Error here; uploader._waitTimer = setTimeout(function () { uploader._wait() }, 100); }, 0);


<asp:Button ID="btnFileUpload" runat="server" Text="Add" onclientclick="FileUploadClick(); return false;"/>
<ajaxToolkit:AsyncFileUpload  runat="server" ID="AsyncFileUpload1" Width="400px" UploaderStyle="Modern" UploadingBackColor="#CCFFFF"/>

А это мой Javascript (я видел разметку, сгенерированнуюэлемент управления и получил тип ввода File, добавив "_ct102")

function FileUploadClick() {
            var fileUploadControl = document.getElementById('<%= AsyncFileUpload1.ClientID %>' + '_ctl02')
            fileUploadControl.click();
            //fileUploadControl.setActive();                
        }

Ответы [ 2 ]

2 голосов
/ 19 декабря 2011

Я исследовал это больше и обнаружил, что это не может быть сделано.Включение ввода типа файла из другого элемента управления отключено по соображениям безопасности.Так что это не может быть сделано.

Единственный обходной путь к стилю управления загрузкой файлов - это поместить элемент управления с непрозрачностью 0 и поместить наш элемент управления ниже этого элемента управления файлом и изменить Z-индекс в HTML.Фактически, это именно тот трюк, который используется в элементе управления AsyncFileUpload.

Вот ссылка, объясняющая трюк http://www.quirksmode.org/dom/inputfile.html

Так что я применил этот трюк к AsyncFileUpload, который внутренне применяет его к файлу HTMLконтроль загрузки

Спасибо всем

0 голосов
/ 30 сентября 2013

Простое решение вышеуказанной проблемы - добавить CSS, например, это будет работать во всех браузерах.

<style type="text/css">
    .FileUploadClass input
    {
        width:100%!important; // mandatory
    }
</style>

<ajaxToolkit:AsyncFileUpload ID="asyncFileUpload" runat="server" CssClass="FileUploadClass" OnUploadedComplete="asyncFileUpload_UploadedComplete" UploaderStyle="Traditional"/>
...