ehirsch/disablingTabs.js

## disablingTabs.js
<!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>Dynamic TabView from JavaScript</title>

<style type="text/css">
/*margin and padding on body element
  can introduce errors in determining
  element position and are not recommended;
  we turn them off as a foundation for YUI
  CSS treatments. */
body {
	margin:0;
	padding:0;
}
</style>

<link type="text/css" rel="stylesheet" href="http://yui.yahooapis.com/3.2.0/build/cssfonts/fonts-min.css" />
<script type="text/javascript" src="http://yui.yahooapis.com/3.2.0/build/yui/yui-min.js"></script>


<!--begin custom header content for this example-->

<!--end custom header content for this example-->

</head>

<body class="yui3-skin-sam  yui-skin-sam">

<h1>Dynamic TabView from JavaScript</h1>

<div class="exampleIntro">
	This example shows how to create a <code>TabView</code> widget dynamically and insert it into the page.

</div>

<!--BEGIN SOURCE CODE FOR EXAMPLE =============================== -->


<div id="demo">
</div>
<script type="text/javascript">
YUI().use("yui", "tabview", function(Y) {
    var tabview = new Y.TabView({
        children: [{
            label: 'foo',
            content: '<p>foo content</p>'
        }, {
            label: 'bar',
            content: '<p>bar content</p>',
            disabled: true
        }, {
            label: 'baz',
            content: '<p>baz content</p>',
	    disabled: true
        }]
    });

    tabview.render('#demo');
    //tabview.selectChild(2);
});
</script>

<!--END SOURCE CODE FOR EXAMPLE =============================== -->

</body>
</html>

## fix-for-outside-tabview.js
tabView.on('tab:click', function(e) {
    if( e.target.get('disabled')) {
        e.preventDefault();
        e.domEvent.preventDefault();
    }
});

## fix-in-tabview.js
    _onActivate: function(e) {
         if (e.target === this ) {
             //  Prevent the browser from navigating to the URL specified by the
             //  anchor's href attribute.
             e.domEvent.preventDefault();
             // ehirsch 2010-09-17:
             // only select this tab if it is not disabled.
             if( !this.get('disabled') ) {
                e.target.set('selected', 1);
             }
         }
    }
	<!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>Dynamic TabView from JavaScript</title>

	<style type="text/css">
	/*margin and padding on body element
	can introduce errors in determining
	element position and are not recommended;
	we turn them off as a foundation for YUI
	CSS treatments. */
	body {
	margin:0;
	padding:0;
	}
	</style>

	<link type="text/css" rel="stylesheet" href="http://yui.yahooapis.com/3.2.0/build/cssfonts/fonts-min.css" />
	<script type="text/javascript" src="http://yui.yahooapis.com/3.2.0/build/yui/yui-min.js"></script>


	<!--begin custom header content for this example-->

	<!--end custom header content for this example-->

	</head>

	<body class="yui3-skin-sam yui-skin-sam">

	<h1>Dynamic TabView from JavaScript</h1>

	<div class="exampleIntro">
	This example shows how to create a <code>TabView</code> widget dynamically and insert it into the page.

	</div>

	<!--BEGIN SOURCE CODE FOR EXAMPLE =============================== -->


	<div id="demo">
	</div>
	<script type="text/javascript">
	YUI().use("yui", "tabview", function(Y) {
	var tabview = new Y.TabView({
	children: [{
	label: 'foo',
	content: '<p>foo content</p>'
	}, {
	label: 'bar',
	content: '<p>bar content</p>',
	disabled: true
	}, {
	label: 'baz',
	content: '<p>baz content</p>',
	disabled: true
	}]
	});

	tabview.render('#demo');
	//tabview.selectChild(2);
	});
	</script>

	<!--END SOURCE CODE FOR EXAMPLE =============================== -->

	</body>
	</html>
	tabView.on('tab:click', function(e) {
	if( e.target.get('disabled')) {
	e.preventDefault();
	e.domEvent.preventDefault();
	}
	});
	_onActivate: function(e) {
	if (e.target === this ) {
	// Prevent the browser from navigating to the URL specified by the
	// anchor's href attribute.
	e.domEvent.preventDefault();
	// ehirsch 2010-09-17:
	// only select this tab if it is not disabled.
	if( !this.get('disabled') ) {
	e.target.set('selected', 1);
	}
	}
	}