开发者

Help with recreating Wordpress image upload with ASP MVC3

开发者 https://www.devze.com 2023-03-29 19:39 出处:网络
I\'m trying to recreate the Wordpress image upload feature in MVC3 where a pop-up allows you to insert the image url and edit the image properties like the alt tag, size and position after it has been

I'm trying to recreate the Wordpress image upload feature in MVC3 where a pop-up allows you to insert the image url and edit the image properties like the alt tag, size and position after it has been uploaded to the server. I tried playing around with jqueryUi and an uploading ActionResult and was able to upload the file, but I'm now stumped trying to return the uploaded URL back to the pop-up.

Anyone tried and succeeded with this?

EDIT:

Here is my ActionResult that uploads and preps the uploaded image url.

[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...
}

My jqueryui dialog:

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


One idea would be to use Ajax to post to a JsonResult action which responds with an object containing the uploaded URL.

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

Where your action would look something like

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

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

Then in your ajax success function you will be able to access the path as such:

var jsPath = receive.path

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号