[CLOSED] how to have a Dynamic textfield in beforebind

[arjunrvasisht]

I found the below code in the forum for having a dynamic combobox inside a grid during the beforebind event.:

<script>
        var onBeforeBind = function(column, e) { // "e" contains "config", "grid", "record", "rowIndex".
            e.config = {
                xtype: "netmulticombo",
                queryMode: "local",
                displayField: "text",
                store: {                     
                    /* configure a store as needed */ 
                    model: Ext.define("Model" + e.rowIndex, {
                        extend: "Ext.data.Model",
                        fields: [ "text" ]
                    }),
                    data: [{
                        text: "Item1"
                    }, {
                        text: "Item2"
                    }]
                }
            };
        };
    </script>

Can someone provide me the code for having a dynamic textfield. Based on the row index I want to set that row as an editable field.

[Daniil]

Hi @arjunrvasisht,

Please use:

e.config = {
    xtype: "textfield"
};

[arjunrvasisht]

Thanks Daniil,

How do i have a render event for a dynamically created text field.

 <ext:TextField ID="TextField1" runat="server">
                                                    <Listeners>
                                                        <Render Fn="disableTier3DisplayName"></Render>
                                                        <Blur Handler="setT3BlurEvenCall();validateDistinctT3(this,#{storeDistinctT3});validateDistinctT3grdTier3Mapping(this,#{str3TierMapping});validateDistinctT3withOthers(this,#{strNewTier3});"></Blur>
                                                        <Change Fn="checkForT3edit"></Change>
                                                        <AfterRender Handler="this.el.dom.setAttribute('onPaste', 'return false');" />
                                                    </Listeners>
                                                </ext:TextField>

Like the above text field I have Render, blur change and after render event written for a text field. How do I write these events for the dynamically created one. This is how i have created dynamically:

 e.config = {
                    xtype: "textfield",
                    queryMode: "local",
                    displayField: "text",
                    store: {
                        /* configure a store as needed */
                        model: Ext.define("Model" + e.rowIndex, {
                            extend: "Ext.data.Model",
                            fields: ["text"]
                        })
                    }
                };

[Daniil]

Please use this technique:
http://forums.ext.net/showthread.php...ll=1#post89172

[arjunrvasisht]

Thanks Daniil,

As per the link u have suggested I could code like below:

 e.config = {
                    xtype: "textfield",
                    queryMode: "local",
                    displayField: "text",
                    // readOnly : true,
                    disabled : true, 
                    //selectable : false,
                    listeners : {
                        change : {
                            fn : checkForT3OtherEdit
                        },
                        afterrender : {
                            handler : this.el.dom.setAttribute('onPaste', 'return false')
                        }
                    },
                    store: {
                        /* configure a store as needed */
                        model: Ext.define("Model" + e.rowIndex, {
                            extend: "Ext.data.Model",
                            fields: ["text"]
                        })
                    }
                };
            }

The change event inside the listener is working fine but the code which i have in handler is not working. I didn't find the syntax to write after render event and handler in the link u have suggested. Could you please tell me how do I write a after render and handler event.

[Daniil]

It should be

afterrender: {
    fn: function() { 
        this.el.dom.setAttribute('onPaste', 'return false');
    }
}

[arjunrvasisht]

Thanks Daniil, it worked fine. One last thing. How do i write the below blur event:

 <Blur Handler="setT3BlurEvenCall();validateDistinctT3(this,#{storeDistinctT3});validateDistinctT3Others(this,#{str3TierMapping});"></Blur>

I tried something like this:

 blur : {
                            fn: function(){
                                setT3OtherBlurEvenCall();validateDistinctT3OthersName(this,#{storeDistinctNewTier3});
                            }                            
                        }

But it dint work.!!

[geoffrey.mcgill]

One of the easiest ways to learn the JavaScript syntax is to view the JavaScript generated by Ext.NET. Take the configuration that is working, then view the source and search for your code in the generated source.

Hope this helps.