jenny/DT2 + Tabs3 + resizeable columns

## DT2 + Tabs3 + resizeable columns
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>DT2 + Tabs3 + resizeable columns</title>
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.8.1/build/datatable/assets/skins/sam/datatable.css" />


<script type="text/javascript" charset="utf-8"
        src="http://yui.yahooapis.com/3.1.1/build/yui/yui-min.js">
</script>
</head>

<body class="yui3-skin-sam yui-skin-sam">
<h1>DT2 + Tabs3 + resizeable columns</h1>

<!--BEGIN SOURCE CODE FOR EXAMPLE =============================== -->
<div id="demo">
    <ul>
        <li><a href="#foo">foo</a></li>
        <li><a href="#bar">bar</a></li>
        <li><a href="#baz">baz</a></li>
    </ul>
    <div>
        <div id="foo">
            <p>foo content</p>
        </div>
        <div id="basic">
        </div>
        <div id="baz">
            <p>baz content</p>
        </div>
    </div>
</div>

<script>
YUI().use('tabview',"yui2-dragdrop", "yui2-datatable", function(Y) {
    var YAHOO = Y.YUI2;

    var myData = {
        bookorders: [
            {id:"po-0167", date:new Date(1980, 2, 24), quantity:1, amount:4, title:"A Book About Nothing"},
            {id:"po-0783", date:new Date("January 3, 1983"), quantity:null, amount:12.12345, title:"The Meaning of Life"},
            {id:"po-0297", date:new Date(1978, 11, 12), quantity:12, amount:1.25, title:"This Book Was Meant to Be Read Aloud"},
            {id:"po-1482", date:new Date("March 11, 1985"), quantity:6, amount:3.5, title:"Read Me Twice"}
        ]
    };

    var myColumnDefs = [
        {key:"id", sortable:true, resizeable:true},
        {key:"date", formatter:YAHOO.widget.DataTable.formatDate, sortable:true, sortOptions:{defaultDir:YAHOO.widget.DataTable.CLASS_DESC},resizeable:true},
        {key:"quantity", formatter:YAHOO.widget.DataTable.formatNumber, sortable:true, resizeable:true},
        {key:"amount", formatter:YAHOO.widget.DataTable.formatCurrency, sortable:true, resizeable:true},
        {key:"title", sortable:true, resizeable:true}
    ];

    var myDataSource = new YAHOO.util.DataSource(YAHOO.example.Data.bookorders);
    myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSARRAY;
    myDataSource.responseSchema = {
        fields: ["id","date","quantity","amount","title"]
    };

    var myDataTable = new YAHOO.widget.DataTable("basic",
            myColumnDefs, myDataSource, {caption:"DataTable Caption"});

    var tabview = new Y.TabView({srcNode:'#demo'});
    tabview.render();
});
</script>
<!--END SOURCE CODE FOR EXAMPLE =============================== -->
</body>
</html>
	<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
	<html>
	<head>
	<meta http-equiv="content-type" content="text/html; charset=utf-8">
	<title>DT2 + Tabs3 + resizeable columns</title>
	<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.8.1/build/datatable/assets/skins/sam/datatable.css" />


	<script type="text/javascript" charset="utf-8"
	src="http://yui.yahooapis.com/3.1.1/build/yui/yui-min.js">
	</script>
	</head>

	<body class="yui3-skin-sam yui-skin-sam">
	<h1>DT2 + Tabs3 + resizeable columns</h1>

	<!--BEGIN SOURCE CODE FOR EXAMPLE =============================== -->
	<div id="demo">
	<ul>
	<li><a href="#foo">foo</a></li>
	<li><a href="#bar">bar</a></li>
	<li><a href="#baz">baz</a></li>
	</ul>
	<div>
	<div id="foo">
	<p>foo content</p>
	</div>
	<div id="basic">
	</div>
	<div id="baz">
	<p>baz content</p>
	</div>
	</div>
	</div>

	<script>
	YUI().use('tabview',"yui2-dragdrop", "yui2-datatable", function(Y) {
	var YAHOO = Y.YUI2;

	var myData = {
	bookorders: [
	{id:"po-0167", date:new Date(1980, 2, 24), quantity:1, amount:4, title:"A Book About Nothing"},
	{id:"po-0783", date:new Date("January 3, 1983"), quantity:null, amount:12.12345, title:"The Meaning of Life"},
	{id:"po-0297", date:new Date(1978, 11, 12), quantity:12, amount:1.25, title:"This Book Was Meant to Be Read Aloud"},
	{id:"po-1482", date:new Date("March 11, 1985"), quantity:6, amount:3.5, title:"Read Me Twice"}
	]
	};

	var myColumnDefs = [
	{key:"id", sortable:true, resizeable:true},
	{key:"date", formatter:YAHOO.widget.DataTable.formatDate, sortable:true, sortOptions:{defaultDir:YAHOO.widget.DataTable.CLASS_DESC},resizeable:true},
	{key:"quantity", formatter:YAHOO.widget.DataTable.formatNumber, sortable:true, resizeable:true},
	{key:"amount", formatter:YAHOO.widget.DataTable.formatCurrency, sortable:true, resizeable:true},
	{key:"title", sortable:true, resizeable:true}
	];

	var myDataSource = new YAHOO.util.DataSource(YAHOO.example.Data.bookorders);
	myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSARRAY;
	myDataSource.responseSchema = {
	fields: ["id","date","quantity","amount","title"]
	};

	var myDataTable = new YAHOO.widget.DataTable("basic",
	myColumnDefs, myDataSource, {caption:"DataTable Caption"});

	var tabview = new Y.TabView({srcNode:'#demo'});
	tabview.render();
	});
	</script>
	<!--END SOURCE CODE FOR EXAMPLE =============================== -->
	</body>
	</html>