如何在Extjs 3.2上使用卡片布局创建高级向导表单？

extjs 2.0有一个Ext.ux.wizard，我们可以创建类似extjs的向导，并在用户单击时轻松验证表单元素（例如，下一个按钮）。请参见示例：http://www.siteartwork.de/wizardcomponent_demo。在extjs 3.2中，有卡片布局可以帮助创建向导。请参阅演示：http://dev.sencha.com/deploy/dev/examples/layout-browser/layout-browser.html。
代码：如何在Extjs 3.2上使用卡片布局创建高级向导表单？

/* 
* ================ CardLayout config (Wizard) ======================= 
*/ 
var cardWizard = { 
    id:'card-wizard-panel', 
    title: 'Card Layout (Wizard)', 
    layout:'card', 
    activeItem: 0, 
    bodyStyle: 'padding:15px', 
    defaults: {border:false}, 
    bbar: ['->', { 
     id: 'card-prev', 
     text: '&laquo; Previous', 
     handler: cardNav.createDelegate(this, [-1]), 
     disabled: true 
    },{ 
     id: 'card-next', 
     text: 'Next &raquo;', 
     handler: cardNav.createDelegate(this, [1]) 
    }], 
    items: [{ 
     id: 'card-0', 
     html: '<h1>Welcome to the Demo Wizard!</h1><p>Step 1 of 3</p><p>Please click the "Next" button to continue...</p>' 
    },{ 
     id: 'card-1', 
     html: '<p>Step 2 of 3</p><p>Almost there. Please click the "Next" button to continue...</p>' 
    },{ 
     id: 'card-2', 
     html: '<h1>Congratulations!</h1><p>Step 3 of 3 - Complete</p>' 
    }] 
};

但似乎当我点击下一个，或者没有提交按钮，当我到达wizard.does人的最后一步有任何的例子在更发达的向导没有验证？

来源

2011-02-18 Mehdi Fanai