How to create a function in Sencha Architect?

Question

Ext.Ajax.request({
   url: 'foo.php',    // where you wanna post
   success: passFn,   // function called on success
   failure: failFn,
   params: { foo: 'bar' }  // your json data
});

I am following How to post json data with extJS and got a question regarding functions. I see that we can embed functions right in the passFn and failFn area. However, what if I want these functions to be elsewhere? Where to create these functions and code them in Sencha Architect?

Answer 1

You can create a folder that is outside of Sencha Architect control, and call it from inside your Architect code.

For example, I like to create a folder called "util". So here is what your folder structure will look like:

app
  -- controller
  -- model
  -- store
  -- view
  -- util    <--- I added this directory
      -- MiscFunctions.js  <-- your own class file

Inside MiscFunctions.js, you would create the class like so:

Ext.define('MyApp.util.MiscFunctions', {
   singleton: true,
   passFn: function() {
      ...
   },
   failFn: function() {
   }
});

Then you can refer to those functions from inside your Architect code:

Ext.Ajax.request({
   url: 'foo.php',    // where you wanna post
   success: MyApp.util.MiscFunctions.passFn,   // function called on success
   failure: MyApp.util.MiscFunctions.failFn,
   params: { foo: 'bar' }  // your json data
});

Don't forget to add the

singleton: true

part, or else you will have to create an instance of that class to use the functions inside.

Answer 2

Here is how you can use basic functions in architect:

1. Create a controller.

2. Add a controller action and set its attributes as follows:

   controlQuery: '#btn1', // (a button component with id "btn1")
   targetType  : Ext.Button, // (component type)
   fn          : onBtn1Tap, // (function name)
   name        : tap // (event)
   

3. Add a basic function and set its attributes:

   fn: basicFunction  (function name)
   

4. Now you can use this basic function in onBtn1Tap: this.basicFunction()