1. 程式人生 > >給ajax表單提交數據前面加上實體名稱

給ajax表單提交數據前面加上實體名稱

一個 aps nbsp inpu logs 數據格式 思考 ret user

有時候我們後臺做了一個引用類型例如:

下面的實體以C#為例

public class Order{

    public string orderId{get;set;}
    
    public OrderItem orderItem{get;set;}
}

public class OrderItem{
    
    public string productName{get;set;}
public decimal price{get;set;} }

前臺頁面的html結構:

<form 
id="form1"> <input type="text" name="productName" value="milk" /> <input type="text" name="price" value="1.43" /> <input type="submit" name="submit" value="submit" /> </form>

後臺在獲取OrderItem的時候我們期望提交的數據格式是

{orderItem.productName:"",orderItem.price:""}

首先我們先回收表單的數據這裏給一jquery的插件

技術分享
;(function ($) {
    $.fn.serializeJson = function () {
        var serializeObj = {}
        var array = this.serializeArray()
        var str = this.serialize()
        $(array).each(function () {
            if (serializeObj[this.name]) {
                
if ($.isArray(serializeObj[this.name])) { serializeObj[this.name].push(this.value) } else { serializeObj[this.name] = [serializeObj[this.name], this.value] } } else { serializeObj[this.name] = this.value } }) return serializeObj } })(jQuery);
View Code

var formParam=$("#form1").serializeJson();
console.log(JSON.stringify(formParam))

控制臺輸出{"orderItem":{"productName":"milk","price":"1.45"}}

然後我們思考 orderItem.productName 肯定是對象的子對象才能用.操作符

例如{"UserInfo":{"clsName":"one","name":"li yang"}} 訪問UserInfo的name屬性就可以用UserInfo.name

好了得到了解決思路了

var formParam=$("#form1").serializeJson();
console.log(JSON.stringify(formParam))
console.log($.param(formParam))

控制臺輸出:

{"orderItem":{"productName":"milk","price":1.43}}

orderItem%5BproductName%5D=milk&orderItem%5Bprice%5D=1.43

如果您有更好的解決方法歡迎留言討論或者加入下面的QQ群來交流討論

技術交流QQ群:15129679

給ajax表單提交數據前面加上實體名稱