[제이쿼리] form의 내용을 한번에 오브젝트로 만들기



form 안의 input 데이터들을 ajax로 날려주거나 오브젝트로 만들어야 할때


하나하나 네임이나 id값으로 불러와서 만들기엔 너무나도 귀찮은 작업이다.


이걸 한번에 해결해 줄수 있는 방법에 대해서 알아보자



일단 제이쿼리 플러그인을 사용해야 한다



제이쿼리 시리얼라이즈 링크




사용 방법은


두가지가 있다


하나는 배열로 만들기 하나는 오브젝트로 만드는 방법






1. html


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
  <form id="yameaForm">
    <input name="input1">
    <input name="input2">
    <input name="input3">
    <input name="input4">
    <input name="input5">
    <input name="input6">
  </form> 
</body>
</html>
cs



2. js


1
2
3
4
5
6
7
8
9
function makeObject(){
var param = $("#yameForm").serializeObject();
console.log(param);
}
 
function makeArray(){
var param = $("#yameForm").serializeArray();
console.log(param);
}
cs



위와 같은 방법으로 만들면 된다


짱편함


개편함


짱짱맨임


저작자표시 비영리

'Yame Programmer > Java Script[JQuery]' 카테고리의 다른 글

javascript 배열안의 객체 이름순 정렬  (0) 2021.01.08
javascript 배열안의 중복객체 카운트  (0) 2021.01.08
[자바스크립트] 자바스크립트 다국어 적용 방법  (0) 2017.08.07
YYYYMMDD 형식 날짜 구하기  (0) 2016.12.28
[자바스크립트] 정규식을 이용한 초간단 천단위콤마  (0) 2016.07.26

+ Recent posts

티스토리툴바