1

不能让这个做任何事情。当我单击“上传文件”时,绝对没有任何反应,而且我看不到任何闪存呈现到屏幕上。我相信这在某种程度上与 jquery 有关,但我不确定。请帮忙!如果有人可以给我邮寄一个简单的 VS2010 解决方案,上传到 gmail.com 上的 infinitimods 工作,我会更加感激!非常感谢!

My Layout file:

    <!DOCTYPE html>
    <html>
    <head>
        <title>@ViewBag.Title</title>
        <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
        <link type="text/css" rel="Stylesheet" media="screen" href="/Scripts/uploadify/uploadify.css" />
        <script type="text/javascript" src="/Scripts/uploadify/swfobject.js"></script>
        <script type="text/javascript" src="/Scripts/uploadify/jquery.uploadify.v2.1.4.min.js"></script>
        <script type="text/javascript" src="/Scripts/uploadify/jquery-1.4.2.min.js"></script>
    </head>

    <body>
        @RenderBody()
    </body>
    </html>



My index file:

    @{
        ViewBag.Title = "Index";
        Layout = "~/Views/Shared/_Layout.cshtml";
    }

    <h2>Index</h2>

    @using (Html.BeginForm("UploadFile", "Home", FormMethod.Post, new { enctype = "multipart/form-data" }))
    {        
        <script type="text/javascript">
            $(document).ready(function () {

                $("#file_upload").uploadify({
                    'uploader': '~/Scripts/uploadify/uploadify.swf',
                    'cancelImg': '~/Scripts/uploadify/images/cancel.png',
                    'buttonText': 'Upload foto',
                    'script': '/Home/UploadFiles',
                    'folder': '/Content/upload',
                    'fileDesc': 'Image Files',
                    'fileExt': '*.jpg;*.jpeg;*.gif;*.png; *.txt;',
                    'scriptData': { 'thisGuid': $("input#Id").val() },
                    'multi': false,
                    'auto': true,
                    'onError': function (event, queueID, fileObj, errorObj) {
                        alert("Error!!! Type: [" + errorObj.type + "] Info [" + errorObj.info + "]");
                    }              
                });

                $("#btnSave").button().click(function (event) {
                    $('#file_upload').uploadifyUpload();
                });


            }); 

        </script>

        <input id="file_upload" type="file" />

        <input type="button" id="btnSave" value="Upload file" />

        <input id="Id" name="Id" type="hidden" value="5168e-yada-yada" />
    }

My controller:

public class HomeController : Controller
{
    /// <summary>
    /// 
    /// </summary>
    /// <returns></returns>
    [HttpGet]
    public ActionResult Index()
    {
        return View("Index");
    }

    /// <summary>
    /// 
    /// </summary>
    /// <param name="fileData"></param>
    /// <param name="form"></param>
    /// <returns></returns>
    [HttpPost]
    public string UploadFile(HttpPostedFileBase fileData, FormCollection form)
    {
        return "ok";
    }
}
4

2 回答 2

1

Uploadify 需要 jQuery。这意味着您需要在 uploadify 脚本之前包含 jQuery 脚本。如果您查看过您的 javascript 调试控制台,您会看到此错误。

所以,布局:

<!DOCTYPE html>
<html>
<head>
    <title>@ViewBag.Title</title>
    <link href="@Url.Content("~/Scripts/uploadify/uploadify.css")" type="text/css" rel="stylesheet" media="screen" />
    <script type="text/javascript" src="@Url.Content("~/Scripts/uploadify/swfobject.js")"></script>
    <script type="text/javascript" src="@Url.Content("~/Scripts/uploadify/jquery-1.4.2.min.js")"></script>
    <script type="text/javascript" src="@Url.Content("~/Scripts/uploadify/jquery.uploadify.v2.1.4.min.js")"></script>
</head>

<body>
    @RenderBody()
</body>
</html>

控制器:

public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View();
    }

    [HttpPost]
    public ActionResult UploadFile(HttpPostedFileBase fileData, string thisGuid)
    {
        if (fileData != null && fileData.ContentLength > 0)
        {
            var appData = Server.MapPath("~/app_data");
            var file = Path.Combine(appData, Path.GetFileName(fileData.FileName));
            fileData.SaveAs(file);
        }
        return Json(new { status = true });
    }
}

和观点:

@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<script type="text/javascript">
    $(document).ready(function () {
        $('#file_upload').uploadify({
            'uploader': '@Url.Content("~/Scripts/uploadify/uploadify.swf")',
            'cancelImg': '@Url.Content("~/Scripts/uploadify/images/cancel.png")',
            'buttonText': 'Select photo',
            'script': $('form').attr('action'),
            'fileDesc': 'Image Files',
            'fileExt': '*.jpg;*.jpeg;*.gif;*.png; *.txt;',
            'multi': false,
            'auto': false,
            'onError': function (event, queueID, fileObj, errorObj) {
                alert("Error!!! Type: [" + errorObj.type + "] Info [" + errorObj.info + "]");
            }
        });

        $('form').submit(function () {
            $('#file_upload').uploadifySettings('scriptData', { thisGuid: $('#id').val() });
            $('#file_upload').uploadifyUpload();
            return false;
        });
    }); 
</script>


<h2>Index</h2>

@using (Html.BeginForm("UploadFile", "Home", FormMethod.Post, new { enctype = "multipart/form-data" }))
{        
    <input id="id" name="id" type="hidden" value="5168e-yada-yada" />
    <input id="file_upload" type="file" name="fileData" />
    <input type="submit" value="Upload file" />
}

如果您想在用户选择照片时启动上传过程,您可以摆脱表单和提交按钮并将auto属性设置为true

@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<script type="text/javascript">
    $(document).ready(function () {
        $('#file_upload').uploadify({
            'uploader': '@Url.Content("~/Scripts/uploadify/uploadify.swf")',
            'cancelImg': '@Url.Content("~/Scripts/uploadify/images/cancel.png")',
            'buttonText': 'Select photo',
            'script': $('form').attr('action'),
            'fileDesc': 'Image Files',
            'fileExt': '*.jpg;*.jpeg;*.gif;*.png; *.txt;',
            'multi': false,
            'auto': true,
            'scriptData': { thisGuid: $('#id').val() },
            'onError': function (event, queueID, fileObj, errorObj) {
                alert("Error!!! Type: [" + errorObj.type + "] Info [" + errorObj.info + "]");
            }
        });
    }); 
</script>


<h2>Index</h2>

<input id="id" name="id" type="hidden" value="5168e-yada-yada" />
<input id="file_upload" type="file" name="fileData" />

另外不要忘记查看uploadify 文档以更好地了解不同选项的用途,您还可以查看一些示例。

于 2012-04-12T06:25:33.163 回答
0

您需要使用 asp.net 和 flash 解决一个错误。

这篇文章帮助了我一次:解决 Flash cookie 错误

也许这是一个更好的解决方案:jquery file upload

于 2012-04-12T06:18:52.420 回答