在Jquery中将嵌套表单字段转换为JSON

时间:2015-09-25 21:46:25

标签: javascript jquery json

尝试将Form对象的POST作为JSON从前端javacsript / jquery发送到Spring MVC后端。 表单数据有一个字符串数组和其他字符串字段,如下所示

// client
private void saveScale(ScaleProxy scale) {
    scaleRequest.save(scale)
    .fire(new Receiver<Void>() {
        @Override
        public void onSuccess(Void response) {
            Window.alert("Scale saved.");
        }           
    });
}

// server
public static void save(Scale scale) {
    Session session = HibernateUtil.getSessionFactory().getCurrentSession();

    session.saveOrUpdate(scale);
}

以下是我转换为JSON的代码,

...
var cityList = [];
citylist.push("SF");
citylist.push("LA");
document.forms["myForm"]["dstCities"].value = cityList;
document.forms["myForm"]["dstState"].value = "CA";
...

POST电话:

function convertFormToJSON(){
    var jsonObject = {};
    var array = $("myForm").serializeArray();

    $.each(array, function() {
        if (jsonObject[this.name] !== undefined) {
            jsonObject[this.name].push(this.value || '');
        } else {
            jsonObject[this.name] = this.value || '';
        }
    });

    jsonObject = JSON.stringify(jsonObject);
    console.log("json: " + jsonObject);
    return jsonObject;
};

Json输出:

    $.ajax({
        url: "xxx",
        type: "POST",
        data: convertFormToJSON(),
        contentType: "application/json",
        dataType: 'json',
        ...
   });

但我需要它看起来像

{"dstCities":"SF,LA", "dstState":"CA"}

1 个答案:

答案 0 :(得分:0)

您将数组作为值传递给:

document.forms["myForm"]["dstCities"].value = cityList;

但是浏览器在其上使用toString(),最终结果为加入字符串"SF,LA"

如果意图是将字符串数组传递给它:

document.forms["myForm"]["dstCities"].value = JSON.stringify(cityList);

这种方式不需要对convertFormToJSON进行任何更改。

如果需要将城市显示为逗号分隔值,请更改

   if (jsonObject[this.name] !== undefined) {
       jsonObject[this.name].push(this.value || '');
   } else {
       var value = this.value;
       if (this.name === 'dstCities') {
           value = value.split(',');
       }
       jsonObject[this.name] = value || '';
   }