Jquery - SerializeArray() by ID

扶醉桌前 提交于 2019-12-08 03:50:34

问题


I have this problem, I use serializearray() jquery for serialize all fields of Form to Json. It works fine if in the input I put the name attribute, but if I'd like to put only the ID attribute It doesn't work.

The good function by name [name is similar: '#myformnameid']:

function formToJson(nameForm)
{
 var jsonForm={};
 var queryFrom = $(nameForm).serializeArray();

 for (i in queryFrom) {
   jsonForm[queryFrom[i].name] = queryFrom[i].value;
  }
 return jsonForm;
}

I tried for ID solution with attr.

function formToJson(nameForm)
{
 var jsonForm={};
 var queryFrom = $(nameForm).serializeArray();

 for (i in queryFrom) {
   jsonForm[queryFrom[i].attr("id")] = queryFrom[i].value;
  }
 return jsonForm;
}

Any Idea?


回答1:


What serializeArray does is take the form input objects and converts them into an array of javascript objects. From the documentation, the form is similar to

[
  {
    name: "a",
    value: "1"
  },
  {
    name: "b",
    value: "2"
  },
  {
    name: "c",
    value: "3"
  }    
]

You can iterate over this array by name or value, like you're doing, and it will return the proper data.

The problem you're having is that you're not iterating over the actual elements anymore, just the data from those elements. If you'd like to iterate over the elements, you'll need to do something like:

function formToJson(nameForm)
{
 var jsonForm={};
 $("input", $(nameForm)).each(function(index){
   jsonForm[$(this).attr("id")] = this.value;
 })
 return jsonForm;
}



回答2:


This is an old post, but I thought I'd add my thoughts. Copying the source code from the link below, you will be able to add any element attribute you would like to the returned array. This way your implementation is exactly that of jQuery. Yea, you will need to manually update your code if the jQuery source is updated, but that is the same with the other solutions posed.

https://searchcode.com/codesearch/view/25323764/

var
  rbracket = /\[\]$/,
  rCRLF = /\r?\n/g,
  rsubmitterTypes = /^(?:submit|button|image|reset|file)$/i,
  rsubmittable = /^(?:input|select|textarea|keygen)/i,
  rcheckableType = /^(?:checkbox|radio)$/i;

$.fn.extend({
  customSerializeArray: function() {
    return this.map(function() {

      // Can add propHook for 'elements' to filter or add form elements
      var elements = $.prop(this, 'elements');
      return elements ? $.makeArray(elements) : this;
    })
    .filter(function() {
      var type = this.type;

      // Use .is(':disabled') so that fieldset[disabled] works
      return this.name && !$(this).is(':disabled') &&
        rsubmittable.test(this.nodeName) && !rsubmitterTypes.test(type) &&
        (this.checked || !rcheckableType.test(type));
    })
    .map(function(i, elem) {
      var val = $(this).val();

      if (val == null) {
        return null;
      }

      if ($.isArray(val)) {
        return $.map(val, function(val) {
          return { name: elem.name, value: val.replace(rCRLF, '\r\n') };
        });
      }

      return { name: elem.name, value: val.replace(rCRLF, '\r\n') };
    }).get();
  }
});


来源:https://stackoverflow.com/questions/12153831/jquery-serializearray-by-id

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!