带有fileupload的jQuery AJAX帖子

时间:2010-10-13 16:21:55

标签: jquery ajax jquery-plugins post file-upload

我有一个功能页面将数据发布到Page WebMethod

[WebMethod()]
public static string sayHello(string pTest, string pText)
{
  return pTest + " - " + pText;
}

我使用这个jQuery调用

$(document).ready(function () {
  $("#sayHelloButton").click(function (event) {
    var name = $('#name').val();
    var text = $('#text').val(); 
    var dataString = JSON.stringify({
      pTest: name,
      pText: text
    }); 

    $.ajax({
      type: "POST",
      url: "page.aspx/sayHello",
      contentType: "application/json; charset=utf-8",
      data: dataString,
      dataType: "json",
      success: AjaxSucceeded,
      error: AjaxFailed,
      beforeSend: AjaxStart,
      complete: AjaxEnd
    });
  });
});

但现在也应该可以上传文件了,我在这里有点迷失。

从我在这里的不同帖子中可以看到它是不可能的,但如果我错了请纠正我 - 但我已经看到了几个可以上传的jQuery插件,例如通过Flash脚本,但是如何只用一次点击就可以发布数据和上传?有没有人有任何建议上传插件是最好的 - 以及我如何成功上传和发布一个动作?

2 个答案:

答案 0 :(得分:0)

无法告诉所有插件,但我正在使用jQuery Form而没有任何问题。不涉及闪存,它只是创建隐藏的iframe。

Here's a demo

但是如何只需点击一下即可发布数据和上传 该过程与普通的ajax请求相同。您声明了一个表单元素,而不是$('#myform').submit();执行$('#myform').ajaxSubmit()

答案 1 :(得分:0)

假设sayHelloButton是您用于上传文件的表单上的提交按钮的ID,请务必将event.preventDefault();添加到$("#sayHelloButton").click()函数或使用{{1在窗体上阻止浏览器使用其默认行为发布数据。否则,您的ajax代码将永远不会执行。

javascript.void();