serialize()를 이용한 ajax Form 데이터 전송하기

<form id="searchFrm">
    <div class="inline bg_gray dateSearch">
        <span class="dateIcon">
            <input type="text" name="startDate" id="startDate" placeholder="Start date" aria-label="First name" class="date start-date" readonly="readonly">
            <i class="datepicker" target="fromDt"></i>
        </span>
        <span class="wave">~</span>
        <span class="dateIcon">
            <input type="text" name="endDate" id="endDate" placeholder="End date" aria-label="Last name" class="date end-date"  readonly="readonly">
            <i class="datepicker" target="toDt"></i>
        </span>
        <input type="text" name="sysNm" class="txtinput" placeholder="시스템 명을 입력해 주세요.">
        <input type="text" name="tableNm" class="txtinput" placeholder="테이블 명을 입력해 주세요.">
        <button onclick="fn_searchExt()" id="searchBtn" class="search" type="button">검색</button>
    </div>
</form>

<script type="text/javascript">
    function fn_batchresult() {
        var data = $('#searchFrm').serialize();
        // serialize() : 입력된 모든Element(을)를 문자열의 데이터에 serialize 한다.

        $.ajax({
            type : "GET",
            url : "<c:url value='/batchResult/ajax/selectBatchResultList'/>",
            data: data,
            success : function(returnData, status) {
            ...
            },
            error: function (xhr, ajaxOptions, thrownError) {
            alert(xhr.status);
            }
        });
    }
</script>

Leave a comment