ASP.NET MVC中使用AJAX传参技巧

ASP.NET MVC中使用AJAX传参技巧

 

1.     客户端使用Querystring传参

    一般情况下进行GET请求才会这么做，类似在浏览器的地址栏敲进去的url地址那样，客户端的js代码如下，这里对服务器端做了一个请求（这里用GET），请求通过url上的Querystring传了五个参数：

    下面是服务器端的代码，请注意这个Action（方法）是有参数的，直接接受传客户端传过来的参数

客户端调用AjaxGet方法，得到的结果如下：

 

2.     客户端使用使用Json传参

    使用第一种方法传参的话代码看起来比较简洁，只需要对url进行赋值就行，但是如果参数多的话…会乱，所以一般推荐用data属性传参，以下是使用json对data属性进行赋值传参，和第一种方法一样也是传那五个参数，这次用POST：

    不管是开发还是维护，我们都比较希望看到的是上面这种写法，服务器端的代码不变，当然得到的结果也是一样了（哦不…请求方式变为POST了）

 

2.5   服务器端使用对象接受参数

    上面两种方法有个问题未能解决，那就是服务器端Action方法中的变量多起来也是件麻烦事，ASP.NET MVC框架考虑到这点，我们可以定义一个类，如下：

    端的代码修改如下，传参的变化将不会对Action方法的参数有影响：

 

3.     客户端使用数组传参

    有些时候Ajax请求的参数很复杂，服务器端Action方法的参数可能是一个包含其他对象或者数组的对象，例如2.5中的Option可能是这样定义的：

    问题出现了，客户端还可以用json传参么，我试过是不可以的（也许是我使用的jquery版本或者asp.net mvc版本支持不够好？？），但可以采用以下方法：

    用数组对data赋值，这里数组的写法有点讲究，就是每个item都是一个json，两个属性分别是name和value，作用就无需解释啦。

服务器端的代码小改一下，如下：

         客户端调用AhaxPostWithArray方法，得到的结果如下：

 

 本人在实际项目中，使用到的前后端传参数技巧：

前端：

SysModel是Javascript中的一个自定义对象 

var jsonText = JSON.stringify(SysModel);

$.ajax({
    type: "POST",
    url: "{0}/SR/GetPublishInfoFromWeb".format(appRootPath),
    processData: true,
    data: { jsonText: jsonText },
    success: function (json) {
         //do something
        } 
}); 

后台接收：

SystemModel s = JsonConvert.DeserializeObject<SystemModel>(jsonText);

 另一种方式：

 前端：

$.getJSON("{0}/SR/PublishPrepare".format(appRootPath), { PID: PlanID }, function (json) {
     PublishProcessing();
   }
);

后台：

public ActionResult PublishPrepare(Guid PID)