如何在按钮点击事件中调用extjs中的视图

时间:2013-02-19 05:54:33

标签: extjs yii

我在extjs + Yii框架中工作。我认为 - QbQns.js -

Ext.define('Balaee.view.qb.qbqns.Qbqns',    
        {
    extend:'Ext.form.Panel',
    requires:[
              'Balaee.view.qb.qbqns.QbqnsView'
              ],
              id:'qbqnsId',
              alias:'widget.Qbqns',
              title:'Qbqns',
              height:500,
              items:[
                     { xtype:'QbqnsView',},
                     ],//end of items square
                     buttons:[
                              { xtype:'button',
                                  fieldLabel:'Vote',
                                  action:'voteAction',
                                  name:'vote',
                                  formBind:true,
                                  text:'submit', } ] });

在此提交按钮上单击,我想创建新视图 -

 Ext.define('Balaee.view.qb.qbqns.QbqnsReviewView',
    {
            extend:'Ext.view.View',
            id:'qbqnsViewId',
            alias:'widget.QbqnsReviewView',
            //store:'kp.PollStore',
            store:'qb.QbqnsStore',
            config:
            {
                tpl:'<tpl for=".">'+
                    '<div id="main">'+
                    '</br>'+

                    '<h1 id="q">Question :-</h1> {question}</br>'+

                 /*  '<tpl for="options">'+     // interrogate the kids property within the data
                        '<p>&nbsp&nbsp<input type="radio" name="{parent.questionId}" value="{option}">&nbsp{option}</p>'+
                    '</tpl>'+*/

                    '<tpl for="options">'+
                        '<tpl if="parent.Correctoption==option">'+
                        //'<tpl if="Correctoption==UsersOption">'+
                        '<p style="color:Green"><input type="radio" name="{optionId}">{option}</p>'+

                        '<tpl elseif="parent.UsersOption==option">'+
                        '<p style="color:Red"><input type="radio" name="{optionId}">{option}</p>'+

                        '<tpl else>'+
                        '<p><input type="radio" name="{parent.questionId}" value="{option}">&nbsp{option}</p>'+

                        '</tpl>'+  
                    '</tpl>'+   



     '<p>---------------------------------------------------------</p>'+
                    '</div>'+

                   '<h1 id="q">Total marks are:-</h1>{Total}'+
                   '<h1 id="q">Score you got is:-</h1>{Score}'+

                    '</tpl>',



                itemSelector:'div.main',
            }
    });// End of login class

那么如何在提交按钮单击时从控制器调用上面的视图。请建议我......

1 个答案:

答案 0 :(得分:0)

在您的控制器中:

init: function() {
    this.control({
        'button[action=voteAction]': {
            click: function(btn) {
                Ext.create('Balaee.view.qb.qbqns.QbqnsReviewView', {
                    renderTo: Ext.getBody();  //<-- where you want render it
                });
            }
        }
    });
}

此外,您视图中的商店现在是一个字符串。使用Ext.create()或Ext.getStore(storeId)。

您可能需要阅读guide吗?