Question

我在javascript中创建图像并将其分配给javascript中的img元素。如何将该图像传递给ActionButton上的控制器点击MVC3？

的Javascript

var picture = jqplotToImg($('#ChartContent')); //method to change chart as picture, no needed here
var img = document.getElementById("img1");
img.src = picture;

查看

@using (Html.BeginForm())
{
  <img id="img1" name="img1" />
 @Html.ActionButton("Export","ExportData","Report")
}

控制器

public void ExportReport(FormCollection fc)
{
}

Answer 1

您可以使用HTML5 File API，它允许您将图像异步上传到服务器。

这是另一个example如何将图像转换为Base64字符串，然后可以使用任何方法（例如AJAX）将其发送到服务器。

Answer 2

我提示了base64字符串，然后复制并使用它进行测试，因此失败了。我使用了ajax方法，它可以工作

    function ExportData() {
    var picture = jqplotToImg($('#ChartContent'));
    //prompt("", picture);

    $.ajax({ type: 'POST',
        url: '../Report/Base64ToImage',
        async: false,
        data: { source: picture },
        success: function (data) {
            //alert(data);
        }
    });
    window.location.href = "../Report/ExportChart";
}

[HttpPost]
    public void Base64ToImage(string source)
    {
        string base64 = source.Substring(source.IndexOf(',') + 1);
        base64 = base64.Trim('\0');
        byte[] data = Convert.FromBase64String(base64);
        string path = System.Configuration.ConfigurationManager.AppSettings["UploadFolder"].ToString();

        var file = Server.MapPath(path + "Chart.jpg");
        System.IO.File.WriteAllBytes(file, data);
    }

MVC3将图像传递给控制器

2 个答案: