EXTJS: how to get values inside form window?

Development
1

Hello,

I try to get values inside a form window called from a function in getmenu:


  },
  updateOrder: function (btn, e) {
    if (!this.menu.record || !this.menu.record.id) {
      return false;
    }

    var win = MODx.load({
      xtype: "customer-window-orders-create-update",
      title: "Eintrag ändern",
      params: {
        action: "customer\\processors\\orders\\gelistpos",
        id: this.menu.record.id,
      },
      listeners: {
        success: {
          fn: function () {
            this.refresh();
          },
          scope: this,
        },
      },
    });
    win.fp.getForm().setValues(this.menu.record);
    win.show(e.target);
  }

How to get values or how could I access a specific value for inside call


            items: [
              {
                xtype: "customer-grid-positions",
                action: "customer\\processors\\orders\\getlistpos",
                baseParams: {
                  // send the product id to your processor,
                  // or you'll get all images :)
                  action: "customer\\processors\\orders\\getlistpos",
                  id: xxx,
                },
              },

thank you in advance for an idea.

Bye
Chris

2

Can you describe in more detail what exactly you are trying to do?

From the code you posted, it’s unclear to me, where you are trying to read the form data.

If you have a reference to the form, you could maybe use the findField method ( → myform.findField('some_field').getValue()) or myform.getValues().

3

difficult to explain.

this is the code for the window i called:


// Window
Customers.window.CreateUpdateOrder = function (config) {
  config = config || {};

  this.ident = config.ident || Ext.id();
  //var record = this.getValues();

  alert(this.findField("id").getValue());

  Ext.applyIf(config, {
    width: 500,
    closeAction: "close",
    url: MODx.config.connector_url,
    action: "customer\\processors\\orders\\create",
    shadow: true,
    fields: [
      {
        xtype: "modx-tabs",
        bodyStyle: { background: "transparent" },
        autoHeight: true,
        deferredRender: false,
        items: [
          {
            title: "Kunde",
            layout: "form",
            cls: "modx-panel",
            forceLayout: true,
            bodyStyle: { background: "transparent", padding: "10px" },
            autoHeight: true,
            labelWidth: 200,
            items: [
              {
                xtype: "compositefield",
                combineErrors: false,
                msgTarget: "side",
                items: [
                  {
                    xtype: "combo",
                    mode: "local",
                    triggerAction: "all",
                    forceSelection: true,
                    editable: false,
                    fieldLabel: "PressePass Version",
                    name: "pass_version",
                    hiddenName: "pass_version",
                    displayField: "name",
                    valueField: "value",
                    store: new Ext.data.JsonStore({
                      fields: ["name", "value"],
                      data: [
                        { name: "", value: "" },
                        { name: "Standard", value: "standard" },
                        { name: "Exekutive", value: "executive" },
                        { name: "Premium", value: "premium" },
                      ],
                    }),
                  },
                  {
                    xtype: "combo",
                    mode: "local",
                    value: "mrs",
                    triggerAction: "all",
                    forceSelection: true,
                    editable: false,
                    fieldLabel: "Anrede",
                    name: "gender",
                    hiddenName: "gender",
                    displayField: "name",
                    valueField: "value",
                    store: new Ext.data.JsonStore({
                      fields: ["name", "value"],
                      data: [
                        { name: "Herr", value: "1" },
                        { name: "Frau", value: "2" },
                        { name: "Andere", value: "3" },
                        { name: "", value: "0" },
                      ],
                    }),
                  },
                ],
              },
              {
                xtype: "textfield",
                name: "id",
                anchor: "100%",
              },
              {
                xtype: "textfield",
                fieldLabel: "Titel",
                name: "title",
                anchor: "100%",
              },
              {
                xtype: "textfield",
                fieldLabel: "Name",
                name: "fullname",
                anchor: "100%",
              },
              {
                xtype: "textfield",
                fieldLabel: "Strasse",
                name: "billing_address",
                anchor: "100%",
              },
              {
                xtype: "compositefield",
                combineErrors: false,
                msgTarget: "side",
                items: [
                  {
                    xtype: "textfield",
                    fieldLabel: "PLZ",
                    name: "billing_zip",
                    width: 55,
                  },
                  {
                    xtype: "textfield",
                    fieldLabel: "Ort",
                    name: "billing_city",
                    width: 310,
                  },
                ],
              },
              {
                xtype: "textfield",
                fieldLabel: "Land",
                name: "billing_country",
                anchor: "100%",
              },
            ],
          },
          {
            id: "modx-" + this.ident + "-invoice",
            title: "Abweichende RE",
            layout: "form",
            cls: "modx-panel",
            autoHeight: true,
            forceLayout: true,
            labelWidth: 200,
            defaults: { autoHeight: true, border: false },
            style: "background: transparent;",
            bodyStyle: { background: "transparent", padding: "10px" },
            //MODx.getQRSettings(this.ident,config.record)
            items: [
              {
                xtype: "textfield",
                fieldLabel: "Firma",
                name: "company",
                anchor: "100%",
              },
              {
                xtype: "textfield",
                fieldLabel: "Straße",
                name: "delivery_address",
                anchor: "100%",
              },
              {
                xtype: "textfield",
                fieldLabel: "PLZ",
                name: "delivery_zip",
                anchor: "100%",
              },
              {
                xtype: "textfield",
                fieldLabel: "Ort",
                name: "delivery_city",
                anchor: "100%",
              },
              {
                xtype: "textfield",
                fieldLabel: "Land",
                name: "delivery_country",
                anchor: "100%",
              },
            ],
          },
          {
            id: "modx-" + this.ident + "-addons",
            title: "Positionen",
            layout: "form",
            cls: "modx-panel",
            autoHeight: true,
            forceLayout: true,
            labelWidth: 200,
            defaults: { autoHeight: true, border: false },
            style: "background: transparent;",
            bodyStyle: { background: "transparent", padding: "10px" },
            //MODx.getQRSettings(this.ident,config.record)
            items: [
              {
                xtype: "customer-grid-positions",
                action: "customer\\processors\\orders\\getlistpos",
                baseParams: {
                  // send the product id to your processor,
                  // or you'll get all images :)
                  action: "customer\\processors\\orders\\getlistpos",
                  id: id,
                },
              },
              {
                xtype: "textarea",
                fieldLabel: "Kommentar",
                name: "comment",
                anchor: "100%",
              },
            ],
          },
        ],
      },
    ],
  });
  Customers.window.CreateUpdateOrder.superclass.constructor.call(this, config);
};
Ext.extend(Customers.window.CreateUpdateOrder, MODx.Window);
Ext.reg(
  "customer-window-orders-create-update",
  Customers.window.CreateUpdateOrder
);

how can I get a field value for example id the use it vor inside call for embeded data grid?
I need the id for getting datagrid values for getlistpos processor.

thank you in advance

bye
Chris

PS: ```
this.findField(“id”).getValue()
doesnt run, findField isnt defined …?

4

One way to do this is to add the “id” as a field to the parameter-object when you load the window

var win = MODx.load({
      xtype: "customer-window-orders-create-update",
      ...
      myId: this.menu.record.id,
    });

The value should then be available in the parameter “config” in the window.

this is the window and not the form.
Maybe it works if you use code like this: (I believe “fp” is the “formpanel”.)

myform = this.fp.getForm();
myform.getValues();
5

thank you so much.
so easy.

only add the field in ```
MODx.load


:pray:
6

Another way could be to use find() if you want a particular field, then use getValue() on it.

In the window definition, just under your superclass constructor call e.g.

Customers.window.CreateUpdateOrder.superclass.constructor.call(this, config);

You could listen for the window’s show event and get the field with something like this:

this.on('show', function(win) {
    var field = win.find('name', 'your_field_name_here')[0];
    console.log('This is the value: ' + field.getValue());
});

You can find other components this way too (rather than using the expensive getCmp()!).
If the component you’re trying to find doesn’t have a name then assign it an itemId, and do the find call like this:

parent.find('itemId', 'the_itemId_key_here')[0];