ある種の基本的なフォーム テンプレートまたはコンポーネントを作成している場合は、通常の HTML 要素を使用することに固執し、CSS でルック アンド フィールを制御する必要があると思います。ただし、CQ のダイアログ ウィンドウに表示されるものと同様のフォーム要素を絶対に使用する必要がある場合は、Ext JS フレームワークの CQ の拡張機能を使用してそれらを生成する必要があります。
たとえば、提供された例に類似したボタンを作成する場合は、次のように記述する必要があります。
CQ.Ext.onReady( function(){
var button = new CQ.Ext.Button({
text : "Submit",
id : "buttonclick",
cls : "buttonclick",
renderTo : CQ.Ext.getBody(),
listerners : {
click : function(){
// Write handler code here
}
}
});
});
CQ の最新バージョン (5.5) のウィジェット API:
http://dev.day.com/docs/en/cq/current/widgets-api/index.html
Sencha Ext JS 3.4 に関する資料 (5.5 が構築されていると思います):
http://docs.sencha.com/ext-js/3-4/