MVC使用ajax方法提交表单（一）

目前我常用的方式有两种，这次先介绍第一种，利用formData进行传递：
使用formData进行传递，好处是可以传递文件和图片，而且使用起来也十分方便。
在control控制界面中，我把接收图片及另存为的代码也附上。
下面是js代码

function doUpload() {
        var formData = new FormData($("#form1")[0]);  // 要求使用的html对象
        $.ajax({
            url: 'http://localhost:6751/Home/AjaxAddUser',
            type: 'POST',
            data: formData,
            async: true,
            // 下面三个参数要指定，如果不指定，会报一个JQuery的错误 
            cache: false,
            contentType: false,
            processData: false,
            success: function (msg) {
                alert(msg);
                window.location.href = '/Home/Index';
            },
            error: function (msg) {
                alert(msg);
            }
        });
    }
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

控制器的接收代码

[HttpPost]
        public string AjaxAddUser(FormCollection form, HttpPostedFileBase File1)
        {
            string name = form["name"];
            int age = int.Parse(form["age"]);
            DateTime date = System.DateTime.Now;
            var fileName = Path.Combine(Request.MapPath("~/Upload"), Path.GetFileName(File1.FileName));
            File1.SaveAs(fileName);
            string path = "/Upload/" + Path.GetFileName(File1.FileName);

            UserList u = new UserList();
            u.name = name;
            u.age = age;
            u.jointime = date;
            u.Url = path;
            //添加，这个只是在内存上操作
            db.UserList.AddObject(u);
            //保存到数据库
            int ac = 0;
            string msg;
            ac = db.SaveChanges();
            if (ac > 0)
            {
                msg = "ok";
            }
            else
            {
                msg = "no";
            }
            //return Json(new { options = msg }, JsonRequestBehavior.AllowGet);
            return msg;
        }
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

也可以利用formdata先实现图片的上传，然后在页面中直接预览文件，这样用户在上传之后就可以看到自己上传的图片效果，用户体验更好。具体代码很简单，我就不举例了。