帮助使用ASP MVC3重新创建Wordpress图像上传

时间:2011-08-23 05:55:16

标签: jquery ajax json asp.net-mvc-3 jquery-ui

我正在尝试在MVC3中重新创建Wordpress图像上传功能,其中弹出窗口允许您插入图像URL并在上传到服务器后编辑alt标记,大小和位置等图像属性。我尝试使用jqueryUi和上传ActionResult并且能够上传文件,但我现在难以尝试将上传的URL返回到弹出窗口。

有人尝试过并成功了吗?

修改

这是我的ActionResult,它上传并准备上传的图片网址。

[HttpPost]
public ActionResult Upload(HttpPostedFileBase file)
{
    if (file != null && file.ContentLength > 0)
    {
    var fileName = Path.GetFileName(file.FileName);
    var path = Path.Combine(Server.MapPath("~/Content/Uploads"), fileName);
    file.SaveAs(path);
    //Below is the path I want returned to mypop-up
    ViewBag.WebPath = "/Content/Uploads/" + fileName;
    }
    //no idea which Return string to use...
}

我的jqueryui对话框:

$('#upload-dialog').dialog({
            autoOpen: false,
            width: 600,
            resizable: false,
            title: 'Upload Image',
            modal: true,
            open: function (event, ui) {
                $(this).load('@Url.Action("UploadImagePartial")');
            },
            buttons: {
                "Close": function () {
                    $(this).dialog("close");
                }
            }
        });

1 个答案:

答案 0 :(得分:1)

一个想法是使用Ajax发布到JsonResult操作,该操作使用包含上传URL的对象进行响应。

$.ajax({
    url: "/Controller/Action",
    type: "POST",
    data: { imgData: imgData },
    success: function(receive) {
        // Do whatever
    }
})

您的行为看起来像

public JsonResult Action(string imgData)
{
    // Do whatever upload logic you have
    var imagePath = /* your path */

    return Json(new { path = imagePath });
}

然后在你的ajax成功函数中,你将能够访问这样的路径:

var jsPath = receive.path