Where Do You Put Custom onTriggerClick Triggers In An MVC App?

[rkanemeier]

I'm converting a non-MVC ExtJS 4 app to MVC ExtJS 4. I have an x-form-search-trigger defined in a form and the controller does not seem to recognize the onTriggerClick event. I did some researching and found this thread:

http://www.sencha.com/forum/showthread.php?180018-Trigger-field-triggerclick-is-not-exposed-by-API-so-controllers-cant-catch-it

Someone posted a solution by defining a custom trigger. However, I'm a little confused about where to put this code in the MVC folder structure. Does it belong in the same code as the view that defines the trigger? Is this even an appropriate example of how to handle onTriggerClick events?

[rkanemeier]

Ok,

So I found an easier solution (easier to me I guess) on this thread:

http://www.sencha.com/forum/showthre...-Trigger-field


in the view:

,{
                    xtype: 'trigger',
                    width: 275,
                    name: 'mySearchField',
                    itemId: 'mySearchField',
                    fieldLabel: 'Search',
                    selectOnFocus: true,
                    triggerCls: 'x-form-search-trigger',
                    onTriggerClick: function(e) {
                        this.fireEvent("ontriggerclick", this, event);
			        }
                },

controller code:

    init: function() {
        this.control({
....,
            '#mySearchField' : {
                "ontriggerclick": this.getSearchList
            }
        });
    },

    getSearchList: function() {
        console.log('getSearchList called!');
    }

However, I am still interested in knowing where I should put my custom trigger code (if I chose to go that route).

[scottmartin]

You would place it in your controller as shown in your 2nd post.

'app-form my-combo' :{
    click: me. myClickFunction
}

myClickFunction: function(){
    // code
}

Or did I miss you point?

Scott.

[rkanemeier]

Scott,

Thanks for your response. It's probably important to note that this is my 1st MVC app, and about my 10th ExtJS app. So I'm still new and I'm not 100% up-to-speed on all the terminology yet. When I did my original searches, I found a post (listed above) that suggested making my own Ext.form.field.Trigger. I a When I made my original post, I was curious where I would put this custom form.field.trigger IF I did decide to create one. I continued to do more research and came across the second link I posted, which solved my problem. However, I was/am still curious as to where in the MVC structure I would put my code for a custom form field trigger. The more I look at it, the more I realize that it probably belongs in the VIEW folder (and possibly in the same js file as the VIEW that uses the tigger).

[scottmartin]

The picker itself should be in views, config. etc.. the controller should handle the actions.

The idea of MVC is to structure your code so you or anyone else can read your code and know right away where look.

For the custom picker:
I would create a new JS under app/view/field
Then your view for editing should use field in requires:[]
And the controller for the edit view would contain the action.

Scott.

[filippo.ferrari]

This thread helps me a lot but i've a problem with a reference error.

I'm using 4.1.1 and Architect, this is my code

In myView:

{
      xtype: 'combobox',
      onTriggerClick: function(e) {
                  this.fireEvent("ontriggerclick", this, event);
      },
      itemId: 'ricChiam',
      fieldLabel: 'Chiamante',
      labelWidth: 60,
      hideTrigger: false,
      triggerCls: 'x-form-clear-trigger',
      displayField: 'chiamante',
      store: 'StoreChiamanti',
      valueField: 'id'
} 

In myControler onLaunch function:

this.getRicercaChiamanteFiltri().on({
    'select': this.funcion1,
    'ontriggerclick': this.function2,
    scope: this
}); 

select event works properly (function1) in firebug i've an error 'ontriggerclick' "event is not defined"