[OPEN] [#1834] ComponentLoader behavior

Hello

Is there any reason or logic for following behavior

Let's has TestControl.ascx

Code:

---


<ext:Window runat="server" Width="800" Height="500" Modal="True" Icon="Book" CloseAction="Destroy"
    Hidden="true" Title="User Search" Frame="False" Layout="fit" Controller="EDMSAdmin_User_UserSearchDialogController">

    <Items>
        <ext:Panel Frame="true" runat="server" Border="true">
            <LayoutConfig>
                <ext:HBoxLayoutConfig Align="Stretch" />
            </LayoutConfig>
            <Items>


                <ext:Panel runat="server" Title="Available Groups" Flex="1" Frame="False">

                    <LayoutConfig>
                        <ext:VBoxLayoutConfig Align="Stretch" />
                    </LayoutConfig>
                    <Items>
                        <ext:GridPanel runat="server" Reference="dgvAllGrid" Flex="1" AddPagingToolbar="false">

                            <ColumnModel>
                                <Columns>
                                    <ext:Column DataIndex="GroupName" Text="Name" Flex="1" />
                                </Columns>
                            </ColumnModel>
                            <SelectionModel>
                                <ext:CheckboxSelectionModel runat="server" Mode="Simple" />
                            </SelectionModel>
                        </ext:GridPanel>
                    </Items>
                </ext:Panel>


            </Items>
        </ext:Panel>
    </Items>

</ext:Window>

---

and following code:

Code:

---

  UserControl ctrl = (UserControl)LoadControl("~/TestControl.ascx");
  var jsConfig = ComponentLoader.ToConfig(ctrl, false);

---

The output of that is

Code:

---

"controller": "EDMSAdmin_User_UserSearchDialogController",
    height: 500,
    hidden: true,
    renderTo: Ext.getBody(),
    width: 800,
    "extend": "Ext.window.Window",
    items: [{
        border: true,
        frame: true,
        items: [{
            flex: 1,
            items: [{
                "addPagingToolbar": false,
                reference: "dgvAllGrid",
                xtype: "grid",
                flex: 1,
                columns: {
                    items: [{
                        flex: 1,
                        dataIndex: "GroupName",
                        text: "Name"
                    }]
                },
                selModel: Ext.create("Ext.selection.CheckboxModel", {
                    selType: "checkboxmodel",
                    mode: "simple"
                })
            }],
            layout: {
                type: "vbox",
                align: "stretch"
            },
            title: "Available Groups"
        }],
        layout: {
            type: "hbox",
            align: "stretch"
        }
    }],
    layout: "fit",
    closeAction: "destroy",
    title: "User Search",
    iconCls: "#Book",
    hidden: true,
    modal: true

---

now my questio is - why selmmodel is using

Code:

---

selModel: Ext.create("Ext.selection.CheckboxModel", {
                    selType: "checkboxmodel",
                    mode: "simple"
                })

---

rather then

Code:

---

selModel:  {
                    selType: "checkboxmodel",
                    mode: "simple"
                }

---

is there any way to configure that ?

Hello @Ibrohan!

The reason for that is to allow for early changes in the selection model component from Ext.NET. Some components are created like that to allow instantiating the component before the outer component is actually drawn.

If the selection model was given an ID of MySelectionModel and it was attemped from code behind to this.MySelectionModel.AllowDeselect = false;, during Page_Load() event, Ext.NET would have to guess the selection model was assigned to that grid and will have to know whether the grid was rendered or not before either binding the config value or calling its "setter" (in case of being already rendered/instantiated).

And if thinking client-side, it allows App.MySelectionModel to be available in the earliest, before the component that includes the selection model is actually rendered to the page.

Depending on the component, this behavior can be controlled via its LazyMode config, either Instance (to wrap in the Ext.create()) or Config (just the config object).

In the case of the SelectionModel component, it is always non-lazy and will always be output with Ext.create() to ensure dynamic Ext.NET code will be able to inquire about the component in some circumstances. So it ignores LazyLoad="Config". Yet, in your case it may just work as such, so the option should at least be selectable if explicitly so.

Is this breaking the code in your case? You are supposed to parse (eval()) the "unserialized" object for these parts of the data to get properly resolved. And Ext.NET is supposed to do it in that case. If you're getting an error, please provide the rest of the test case so we can at least point you what could be done to avert the situation if that's a bug.

Anyway, we have logged the selection model "ignoring" its LazyLoad setting under #1834 and will post a follow up here once we further investigate the issue or apply a fix to Ext.NET.

Hope this helps!

Hello

Thanks for reply and explanation, you can close this thread

Would be great to have lazy mode fixed ( and even better if there is some "global" serialization option to serialize everything with given Mode

Jus tto describe some background story - I'm trying to reuse config from js on client side couple times, so if there is some Ext.create inside, it will be instantiated just once for all the usages, which causes problems when object is destroyed.