Sorting tabs in tabPanel using drag and drop

[sencha-dev2]

Hi, I'd like to know if it is possible to let an user sort the tabs he opened by a drag and drop control ? Else, I think it can be done on tab insertion, but it would be smart for users to be able to sort their tabs quickly and easily.

Does anyone know how to do it ?

[scottmartin]

You can have a look at info on dragging buttons on toolbar
http://dev.sencha.com/deploy/ext-4.1...orderable.html

Here is a version for Ext3:
http://www.sencha.com/forum/showthread.php?92033

Scott.

[miti]

Hope there is a version of DDTabPanel for EXT4 soon.

[slemmon]

Using the code from the example Scott referred to you can do the following:

Ext.onReady(function () {
	Ext.define('myTabPanel', {
		extend: 'Ext.tab.Panel',
		//require: ['Ext.ux.BoxReorderer'],
		width: 400,
		height: 400,
		items: [{
			title: 'Foo'
		}, {
			title: 'Bar',
			tabConfig: {
				title: 'Custom Title',
				tooltip: 'A button tooltip'
			}
		}]
	});


	Ext.create('myTabPanel', {
		renderTo: Ext.getBody(),
		tabBar: {
			plugins : Ext.create('Ext.ux.BoxReorderer', {})
		}
	});
});

I commented out the require since I'm running this one from my file system, not a webserver. In which case I just linked to the BoxReorderer.js file in the ux folder under the examples folder in the sdk.