본문 바로가기
즐거움 넘치는 IT 세계/코드로 만드는 디자인

[ jquery 기초 ] jquery FORM API - 폼을 위한 API

by 디리씨 2019. 10. 8.
728x90

 

| 폼이란?

    • 서버로 데이터를 전송하기 위한 수단
    • Query는 폼을 제어하는데 필요한 이벤트와 메소드를 제공한다.
    • jQuery 폼 API 문서 : http://api.jquery.com/category/forms/

 

| 폼(form) 위한 API

웹 프로그램에서 Form은 매우 중요한 요소입니다. 사용자의 데이터를 서버로 전송을 하는 막중한 임무를 뛰고 있습니다. 

ASP.NET에서는 단일 폼의 형태로 구성이 되어 있었으며, 많은 부분이 Form에 대해 크게 신경을 쓰지 않아도 되는 부분이 있었습니다. 하지만 ASP.NET MVC가 나오면서 상황은 바뀌었습니다. 

ASP, PHP 처럼 Form을 직접적으로 컨트롤 하고, 다중 폼을 이용한 프로그래밍이 쉬워졌기 때문입니다. 

물론 ASP.NET도 Form을 통한 데이터 전달이나 이벤트 발생을 하고 있지만 대부분 개발자가 크게 신경을 써야 하는 부분이 적었던 반면에 ASP.NET MVC의 경우는 ASP 처럼 많은 부분에 Form에 대해 신경을 써야 합니다.

 

  • .submit( handler(eventObject) )
    • Submit( handler(eventObject) )
    • Submit( [eventData], handler(eventObject) )
    • Submit()

서버간의 데이터 통신을 위해 form에 있는 데이터를 직렬화 하거나 url을 통해 전달을 하는 경우가 있습니다. 

특히나 Ajax를 이용한 비동기 통신에서는 데이터의 직렬화를 상당히 많이 사용하고 있습니다. 이럴 때를 위해서 jQuery에서는 form 데이터를 쉽게 직렬화 시킬 수 있는 메서드를 제공하고 있습니다.

 

  • .serialize(), .serializeArray()

메서드 이름부터가 직렬화입니다. 

두 메서드의 역할은 동일하며, 반환되는 값에서 약간의 차이를 보이고 있습니다.

.serialize()의 경우 선택한 폼의 값을 “a=1&b=2&c=3”등의 형태로 반환하며, .serializeArray() 메서드의 경우 jQuery 배열 개체로 반환합니다.

쿼리스트링을 통한 Ajax 관련 데이터를 만들 때는 .serialize()를 사용하시면 됩니다.

 

 

728x90
반응형