JavaScript Study


[수정]

moment

  • 날짜/시간 관련 자바스크립트 라이브러리

typeahead

  • 자동완성 구현시 편함. Twitter 에서 제공하는 라이브러리
  • 라이브러리 안에서 json, ajax 등의 호출로 데이터를 가져올 수 있다.
  • 부트스트립 2.x 때와 버전이 다르다. 최근 라이브러리 사용시, 질답게시판에서 유의해서 볼것.

datatables

  • 개인적으로 추천하지 않지만, 딱딱한 형태에 좋고, 필터링이나 검색 기능이 뛰어남
  • paging 을 하지 않는 경우, 큰 데이터를 보여줄때 느리다.
var datatable = $('#table_id').DataTable({  
        bFilter : false,
        bInfo : false,
        bLengthChange : false,
        paging: false,
        scrollY: "700px",
        scrollX: true,
        fixedColumns:   {
            leftColumns: 1 // 컬럼 고정 
        },
        columns:[
            // 단순 컬럼키, 보여지는 값이 아님.
           {
                data:"SEQ",
                render: function ( data, type, full, meta ) {
                    //console.log(full);
                    return '<input type="checkbox" class="checkbox" data-seqno="' + full.SEQNO+ '"/>'
                }
            }, 
            {data:"INPDATE"},  
            {data:"INAMT"}, 
            {data:"JUOKYO"}, 
            {data:"BANKNM"},  
            {data:"ACCT_NO"}  
        ]
    });

//데이터 그리기 
datatable.clear().draw();  
datatable.rows.add(result.data).draw(false); // 컬림키가 key 인, result.data
$('#table tbody').on('click', 'tr', function (e) {
    //행 선택시 checkbox 선택/비선택 
    var checkbox = $(this).children('td').children('input')[0];
    $(checkbox).prop("checked", false); // true or false 

});

bootstrap-daterangepicker

  • 부트스트랩 기반 date 관련 picker
  • 기간 지정하는데에 굉장히 특화되어 있다.
  • 시간 지정은 되지 않는다.

bootstrap-datetimepicker

  • 부트스트랩 기반 datetime 관련 picker
  • 기간 지정은 되지 않지만 시간을 지정할 수 있다.

bootstrap-datepicker

  • datatables 와 함께 쓸 경우, bootstrap-datetimepicker 가 깨질수 있다.
  • 이럴 경우, datepicker 를 사용할 것.
var datepicker_st = $('#ID_SDATE');  
var datepicker_ed = $('#ID_EDATE');

datepicker_st.datepicker({format: "yyyy-mm-dd", orientation:"bottom",  language: "kr"});  
datepicker_ed.datepicker({format: "yyyy-mm-dd", orientation:"bottom",  language: "kr"});  

jsgraphs

  • 자바스크립트 차트를 비교해 놓은 사이트

clipboard.js

  • 클립보드 관련, 복사 & 붙여넣기

audio5.js

  • 음원재생 관련 라이브러리

markdown opensource editor