[jQuery] table 데이터를 json object로 저장하는 코드

1. 시험환경

    - javascript

    - jQuery

 

2. 목적

    - 테이블 데이터를 javascript로 직접 코딩하여 json, jsonArray 형식으로 저장한다.

 

3. 적용

 

function jsonFromTbl(targetTbl) {
    
    var rowSize = targetTbl.find('tbody > tr').length;         // 대상 테이블의 행의 갯수
    var colSize = targetTbl.find('thead > tr > td').length;    // 대상 테이블의 열의 갯수

    if(rowSize < 1)
    {
         alert("테이블에 데이터가 없습니다!");
         return;
    }

    var objArr = new Array();      // 하나의 JSON Object (행)을 저장할 배열 변수
    var tr, td;
    for(var i = 0; i < rowSize; i++)
    {
        tr = targetTbl.find('tbody').find('tr:eq(' + i + ')');

        var obj = new Object();
        for(var j = 0; j < colSize; j++)
        {
            td = tr.find('td:eq(' + j + ')').text();
            obj[header[j]] = td;         // JSON Object에 테이블 컬럼명을 key로 저장, 각 셀을 값으로 저장
        }
        objArr.push(obj);
    }

 

    console.log(objArr);    // 테이블에서 획득한 데이터 확인

    return objArr;
}

 

4. 결론

    - jsGrid 등과 같은 잘 만들어진 테이블 library를 사용하자.

 

 

※ 내용이 도움 되셨다면 광고 클릭 한번 부탁드립니다.