Search

Tag Clouds


테이블을 데이터 그리드로 - TableKit

PDF
tablekit.gif

TableKit은 테이블 태그를 데이터 그리드(Grid) 테이블로 사용할 수 있게하는 Prototype기반 자바스크립트 라이브러리입니다. 로우(row)의 짝수 라인을 시각적으로 구분하며, 컬럼(column)의 헤더(header)를 조작하여 소팅(sortiong) 및 리사이즈(resizing)할 수 있고, Ajax가 적용되어 셀(cell)의 내용을 부분적으로 수정할 수 있게 합니다. 자세한 사용법 및 예제를 살펴봅시다.

TableKit.Sortable.addSortType(
	new TableKit.Sortable.Type('status', {
		pattern : /^[New|Assigned|In Progress|Closed]$/,
		normal : function(v) {
			var val = 4;
			switch(v) {
				case 'New': val = 0; break;
				case 'Assigned': val = 1; break;
				case 'In Progress': val = 2; break;
				case 'Closed': val = 3; break;
			}
			return val;
		}
	})
);

TableKit.options.editAjaxURI = '/echo/';
TableKit.Editable.selectInput('urgency', {}, [
	['1','1'], ['2','2'], ['3','3'], ['4','4'], ['5','5']	
]);

TableKit.Editable.multiLineInput('title');
var _tabs = new Fabtabs('tabs');
$$('a.next-tab').each(function(a) {
	Event.observe(a, 'click', function(e){
		Event.stop(e);
		var t = $(this.href.match(/#(\w.+)/)[1]+'-tab');
		_tabs.show(t);
		_tabs.menu.without(t).each(_tabs.hide.bind(_tabs));
	}.bindAsEventListener(a));
});

Comments

Trackback : http://firejune.com/trackback/1236

  1. avatar

    captcha