비동기 submit 을 진행시에 form 값을 확인해보고 json object 로 받아 한 번에 request 를 날리고 싶을 때 유용하다.
소스
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22
|
$.fn.serializeObject = function () { 'use strict'; var result = {}; var extend = function (i, element) { var node = result[element.name]; if ('undefined' !== typeof node && node !== null) { if ($.isArray(node)) { node.push(element.value); } else { result[element.name] = [node, element.value]; } } else { result[element.name] = element.value; } };
$.each(this.serializeArray(), extend); return result; };
|
예제
1
| var formData = $('#form').serializeObject();
|
여담
checkbox 같은 경우 여러 개 선택시 하나의 key 에 배열로 반환된다.
1 2 3 4 5 6 7 8 9
| <form> <input type="checkbox" name="arr" value="1" checked /> <input type="checkbox" name="arr" value="2" checked /> </form>
<script> var formData = $('form').serializeObject(); </script>
|
사실 이 기능이 제일 매력적이다.
현재 serializeObject library는 더 높은 버전이 있다.
최신 버전에선 form 의 name 속성에 object 를 직접 관리할 수 있다.
최신 버전을 써도 괜찮고, 가볍게 추가해서 쓰고 싶으면 위 버전을 이용하자.