如何在webmatrix(ASP.NET网页)中使用jQuery文件上传?

时间:2013-04-18 00:57:32

标签: jquery file-upload webmatrix

我想在我的网站https://github.com/blueimp/jQuery-File-Upload上使用这个jQuery文件上传,根据文档我需要创建自己的文件上传处理程序,我想知道是否有人有使用jQuery文件上传的经验在webmatrix网站?

而且,我找不到创建自己的文件上传处理程序所需的信息。如果有人可以提供帮助,那就太棒了。

2 个答案:

答案 0 :(得分:1)

我可以帮助你,我为我创建的网站创建一个文件(图像)上传器。

CSHTML Part(sube_archivos.cshtml):

@{
    if (IsPost)
    {
        var fileName = Path.GetFileName(Request.Files["archivo"].FileName);
        var fileSavePath = Server.MapPath("~/Temp/" + fileName);
        try
        {
            Request.Files["archivo"].SaveAs(fileSavePath);

            <img src="~/Temp/@fileName" /> @*you could comment this line...it was the succesful response...an image preview*@

        }
        catch (Exception)
        {
            <text>Error en la subida del archivo</text> @*you could comment this line...error in the uploading*@
        }
    }
}

JQUERY / JAVASCRIPT部分:

function sube(archivo) {
  var primer_archivo = archivo.files[0];
  var data = new FormData();
  data.append('archivo', primer_archivo);
  $.ajax({
    url: "@Href("../../operaciones/sube_archivos.cshtml")",
    type: "POST",
    contentType: false,
    data: data,
    processData: false,
    cache: false,
    success: function (response) {

      //here I put the response ....the image preview or the error message
      $(archivo).parent().next('.imagen_cargada').html(response);

      //here I get the file name and I add it to some specific div
      $(archivo).parent().next().next('.nombre_imagen').val($(archivo).val().split('\\').pop());
    }
  });
}

HTML部分:

    <form method="post" enctype="multipart/form-data">
      <input type="file" name="archivo" onchange="sube(this)" />
    </form>

祝你好运,如果有什么不清楚,请说明。

答案 1 :(得分:0)

Blueimp是一个痛苦的插件......我建议您使用this插件进行表单和文件上传。它配置简单,非常灵活。 blueimp的问题不仅仅是让插件可以使用了。在asp.net mvc和asp.net webmatrix上,它在服务器端也很痛苦。