Ext version tested:

  • Ext 4.2.0 beta 2

Browser versions tested against:
  • Chrome
  • IE9

DOCTYPE tested against:
  • <!DOCTYPE html>

  • A BasicForm doesn't get dynamically added items if they are not added directly to a FormPanel, but somewhere down in hierarchy. So, they are not submitted.
  • It works with ExtJS 4.1.1.
  • As a workaround we reset "_fields" after adding new items. It forces the fields query to be re-executed.

formPanel.getForm()._fields = null;

Steps to reproduce the problem:

  • Click the "add" button
  • Click the "getFields" button

The result that was expected:
  • "1" in the alert box, i.e. one field in the BasicForm

The result that occurs instead:
  • "0" in the alert box

Test Case:

<!DOCTYPE html>
    <title>BasicForm doesn't get dynamically added items</title>

    <link rel="stylesheet" href="../resources/css/ext-all.css" />
    <script src="../ext-all-debug.js"></script>

        Ext.onReady(function () {
            Ext.create("Ext.button.Button", {
                renderTo: Ext.getBody(),
                text: "Add a field to the interim container",
                handler: function () {
                        xtype: "textfield",
                        value: "Hello"

            Ext.create("Ext.button.Button", {
                renderTo: Ext.getBody(),
                text: ".getFields().getCount()",
                handler: function () {

            Ext.create("Ext.form.Panel", {
                id: "FormPanel1",
                renderTo: Ext.getBody(),
                items: [{
                    id: "SomeInterimContainer1",
                    xtype: "container"