Как заставить swfupload работать с Asp.Net MVC 2 - PullRequest
0 голосов
/ 27 августа 2010

Я пытаюсь использовать плагин swfUpload jquery / flash для загрузки, и я следую подходу Стивена Сандерсона (http://blog.stevensanderson.com/2008/11/24/jquery-ajax-uploader-plugin-with-progress-bar/).Но я не могу заставить его работать.Он отлично работает в примере приложения, которое я скачал с его сайта.Просто, чтобы попытаться заставить его работать, я попытался скопировать его страницу и все непосредственно в моем приложении, но это все еще не работает.

Вот страница:

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
    <head>

    <title>File upload</title>
        <link rel="Stylesheet" href="../../Content/Site.css" />
<%--        <script src="../../Scripts/jquery-1.2.6.min.js"></script>--%>
        <script src="../../Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
        <script type="text/javascript" src="../../Scripts/swfupload.js"></script>

        <script type="text/javascript" src="../../Scripts/jquery-asyncUpload-0.1.js"></script>
    </head>
    <body>
        <div id="MainContents">
            <form enctype="multipart/form-data" method="post">
                <h1>Your profile</h1>
                <p>(In a real app, other form controls would appear here)</p>
                <p>
                    Upload your photo: <input type="file" id="photo" name="photo" />
                </p>

                <input type="submit" value="Save my profile" />
            </form>
        </div>        
        <script type="text/javascript">
            $(function () {
                $("#photo").makeAsyncUploader({
                    upload_url: "/Customers/AsyncUpload/",
                    flash_url: '../../Scripts/swfupload.swf',
                    button_image_url: '/Content/blankButton.png',
                    disableDuringUpload: 'INPUT[type="submit"]'
                });
            });        
        </script>  
        <div id="result"></div>
    </body>
</html>

ИВот метод действия:

    public Guid AsyncUpload()
    {

        return _fileStore.SaveUploadedFile(Request.Files[0]);
    }

Это в контроллере CustomersController, и у меня это в начале контроллера:

private IFileStore _fileStore = new DiskFileStore();

Так же, как он делает в своем примере.Конечно, у меня также есть интерфейс IFileStore и класс DiskFileStore.

У меня есть все ссылки на файлы js и css в теге head:

<head>

<title>File upload</title>
    <link rel="Stylesheet" href="../../Content/Site.css" />
    <script src="../../Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="../../Scripts/swfupload.js"></script>
    <script type="text/javascript" src="../../Scripts/jquery-asyncUpload-0.1.js"></script>
</head>

(хотя я использовалпоследний jQuery у меня есть, а не 1.2.6, который он имел в своем образце).Я знаю, по крайней мере, что сценарии запускаются, потому что в FireBug я вижу, что ввод динамически изменяется на флэш-объект, как и должно быть.

Дело в том, что AsyncUpload () никогда даже не вызывается,Я установил точку останова, которая никогда не достигается.И я получаю разные ошибки.В первый раз, когда я попробовал это, я получил ошибку 302 в окне предупреждения от сценария.(В то время у меня были другие сценарии jQuery на той же странице, поэтому я начал заново с более чистой страницы, используя только эти сценарии).Но теперь я не получаю никакой ошибки, я могу выбрать изображение и все, но тогда он просто останавливается на этапе, на котором текст говорит «Загрузка ...», но я не вижу индикатор выполнения или что-то еще, и этоникогда не заканчивается.

Есть идеи, что я делаю не так?

Ответы [ 2 ]

1 голос
/ 20 января 2012

используйте ниже CSS для решения проблемы Firefox

DIV.ProgressBar { 
    width: 100px; padding: 0; border: 1px solid black; margin-right: 1em;
    height:.75em; margin-left:1em; display:-moz-inline-stack;
    display:inline-block; zoom:1; *display:inline; 
}
DIV.ProgressBar DIV { 
    background-color: Green; font-size: 1pt; height:100%; float:left; 
}
SPAN.asyncUploader OBJECT { 
    position: relative; top: 5px; left: 10px; 
}
0 голосов
/ 29 августа 2010

Оказалось, проблема в том, что он не работал в Firefox, только в IE (для разнообразия ...). Что-то с печеньем. Для тех, кто заинтересован, смотрите раздел комментариев в блоге Стивена Сандерсона, о котором я упоминал выше!

...