Question

I have added a Button in the View

{
     xtype:'button',
     id:'when_button_click',
     text:'Button Click',
     ui:'alert'
}

In the controller, i have the following code;

1.) The problem i have is that it doesn’t execute from Ext.Ajax.request({ line onwards in the onNewNote function. How can i make the program send data to that URL.

2.) In the View, i have several textfields, so when the user taps on the button, i need the values entered in the textfields to be sent to the Controller class and then send it over the webservice. How can i send textfield data from the View class to the Controller class ?

Ext.define('myapp.controller.testcont', {

                      extend: "Ext.app.Controller",
                      config: {
                      refs: {
                      newNoteBtn: "#when_button_click"
                      },
                      control: {
                      newNoteBtn: {
                      tap: "onNewNote"
                      }
                      }
                      },
                      onNewNote: function () {

                     console.log("inside onNewNote function");

           Ext.Ajax.request({
                            url: 'http://call.com/the_webservice',
                            params : values,

                            failure: function (response) {
                            var text = response.responseText;
                             console.log("fail");

                            },                              success: function (response) {
                            var text = response.responseText;
                             console.log("success");

                            }

                            });

           var view = Ext.create('Ext.navigation.View', {
                                 fullscreen: true,
                                 items: [
                                         {
                                         title: 'Navigation View',
                                         html: 'This is the first item in the stack!'
                                         }
                                         ]
                                 });

                      }

                      // init and launch functions omitted.
                      });

Answer 1

Typically when you define multiple form fields, you have to wrap them in a FormPanel component first, set an id for it, let’s say id: 'form', then in your controller:

Ext.getCmp('form').getValues();

will return an object containing values from each field in your form panel.