Expert wanna be
Expert wanna be

Reputation: 10624

Extjs4, How to call controller action method from view?

I want to call method in controller from view when click a cell in grid.

{ header: "<img src='/Content/images/icons/page_white_acrobat.png'/>", width: 30, dataIndex: 'documents', sortable: true, renderer: this.hasDocument,
    listeners: {
        click: function () {
        //how to call method in controller?
        }
    }
},

Anybody know, please advice me.

Thanks!

Upvotes: 0

Views: 10392

Answers (2)

Fidget
Fidget

Reputation: 21

I am sure the original person have come across the answer or did something to do the trick.

But for the people that may have the same question here is a quick example of what to do:

Don't put a listener in to (MVC)-VIEW of your application. Give the element an ID (in this case the grid)

In the (MVC) - CONTROLLER add this function:

init : function(app) {
    this.control({
        'myWindow': {
            afterrender : this.doAfterRender 
            /*SAMPLE*/
        },
        'myWindow #someGrid_ID' : {
            select: this.doSelect 
            /* THIS FUNCTION IS LOCATED in the Controller*/
        }
    });
},
doSelect : function() { 
    /*....*/ 
}

now the controller will listen for the event and react on it.

I hope this helps a few people who might struggle with this.

look at :

Dom Query - Explained:

  • "myWindow #someGrid_ID" - The dom Query note the # it refers to the ID of the element.
  • "myWindow" - refers to my window's Alias.
  • "someGrid_ID" - refers to my grid's ID.

(The grid is a child element of "myWindow")

hope this helps

Upvotes: 1

BendaThierry.com
BendaThierry.com

Reputation: 2110

You will have a lot of tutorials for extjs 4 on the official forum of the project by Sencha.

When I provide some usefull link to good starting tutorials... with a specific one's about grid management... I think people could look at it really before voting down. Look at it and see yourself some very better ways to do what the question asker wants to do.

Providing direct answers are not always the best way to learn.

Anyway... the following will do the trick:

var controller = this.getController(Ext.String.capitalize(config.controller));
/* where config was an argument of your callback method) */

I suggest you to decouple as much as possible View from Controllers and View from Model. If you look at the projects I have linked, you will find in the Viewport.js a good way to do that. It is calling the controller with .callParent(arguments) method call at the end of these short script.

Upvotes: 2

Related Questions