YUI :: DataTable :: basic.html

이 중에서 Basic Table을 자세히 살펴 보겠습니다.

샘플코드 부분 날리고, Logger 부분을 날리고, CSS 부분도 날리면 다음과 같이 보입니다.

<script type="text/javascript">
var myColumnHeaders = [
    {key:"POID", abbr:"Purchase order ID", sortable:true, resizeable:true},
    {key:"Date", type:"date", sortable:true, resizeable:true},
    {key:"Quantity", type:"number", sortable:true, resizeable:true},
    {key:"Amount", type:"currency", sortable:true, resizeable:true},
    {key:"Title", type:"html", sortable:true, resizeable:true}
];

var myColumnSet = new YAHOO.widget.ColumnSet(myColumnHeaders);

var myDataSource = new YAHOO.util.DataSource(YAHOO.example.Data.bookorders);
myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSARRAY;
myDataSource.responseSchema = {
    fields: ["POID","Date","Quantity","Amount","Title"]
};
var myDataTable = new YAHOO.widget.DataTable("basic", myColumnSet, myDataSource,{caption:"Whiteship: Basic Table"});
</script>