js ajax方式拼接參數

項目采用前端easyui+后端handler方式，一個老套的組合，比較適合當前的團隊。

項目中有大量場景是做數據展示，主要是收集表單上的參數，統一提交到后端進行sql語句的拼裝然后json序列化到前端grid控件上。

為減少前后端代碼量，約定好前端和后端字段保持一致，前端封裝一個js函數負責收集參數提交到后端，后端動態解析轉換為sql語句where部分。

//獲取容器的鍵值對
function getParams(elem) {
    var params = {};
    $(elem).find("*").each(function () {
        if ($(this).attr("name")) {
            var key = $(this).attr("name");
            var value = "";
            if ($(this).val()) {
                value = $(this).val();
            } else {
                value = $(this).text()
            }
            if (value != "") {
                params[key] = value;
            }
        }
    });
    return params;
}

 

//將鍵值對組裝為URL參數格式
var parseParam = function (param, key) {
    var paramStr = "";
    if (param instanceof String || param instanceof Number || param instanceof Boolean) {
        paramStr += "&" + key + "='" + encodeURIComponent(param) + "'";
    } else {
        $.each(param, function (i) {
            var k = key == null ? i : key + (param instanceof Array ? "[" + i + "]" : "." + i);
            paramStr += '&' + parseParam(this, k);
        });
    }
    return paramStr.substr(1);
};

 js提交的時候只需要傳入參數的容器即可。

 function search() {
            var params = getParams("#customtb");//收集容器里查詢條件
            $('#myGrid').datagrid('load', { 't': 'search', keyWord: parseParam(params) });
        }

 

后端解析，如果不涉及條件的特殊處理，后端得到參數直接替換&為and即可，因項目中有時間字段，做了特殊處理。

 public static string TranlateUrl2QueryString(string strParams)
        {
            string sql = "";
            if (!string.IsNullOrWhiteSpace(strParams))
            {
                string[] arrParams = strParams.Split('&'); //dtStart='2016-05-04' 
                List<string> list = new List<string>();
                foreach (string s in arrParams)
                {
                    if (s.ToLower().StartsWith("dtstart"))//時間的特殊處理
                    {
                        string[] keyPairs = s.Split('=');
                        string sqlKeyPairs = string.Format(" MODIFYON > to_date({0}, 'yyyy-MM-dd') ", keyPairs[1]);
                        list.Add(sqlKeyPairs); //sqlWhere += sqlKeyPairs;
                    }
                    else if (s.ToLower().StartsWith("dtend"))
                    {
                        string[] keyPairs = s.Split('=');
                        string sqlKeyPairs = string.Format(" MODIFYON < to_date({0}, 'yyyy-MM-dd') ", keyPairs[1]);
                        list.Add(sqlKeyPairs);
                    }
                    else
                    {
                        list.Add(s);
                    }
                }
                sql = Utils.URLDecode(" where " + string.Join(" and ", list));
            }
            return sql;
        }