PDA

View Full Version : [CLOSED] how to have a Dynamic textfield in beforebind



arjunrvasisht
May 07, 2015, 4:50 AM
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
May 07, 2015, 7:41 PM
Hi @arjunrvasisht,

Please use:

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

arjunrvasisht
May 11, 2015, 9:04 AM
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,#{stor eDistinctT3});validateDistinctT3grdTier3Mapping(th is,#{str3TierMapping});validateDistinctT3withOther s(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
May 11, 2015, 4:24 PM
Please use this technique:
http://forums.ext.net/showthread.php?20673&p=89172&viewfull=1#post89172

arjunrvasisht
May 12, 2015, 9:33 AM
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
May 12, 2015, 8:49 PM
It should be

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

arjunrvasisht
May 13, 2015, 4:17 AM
Thanks Daniil, it worked fine. One last thing. How do i write the below blur event:


<Blur Handler="setT3BlurEvenCall();validateDistinctT3(this,#{stor eDistinctT3});validateDistinctT3Others(this,#{str3 TierMapping});"></Blur>

I tried something like this:



blur : {
fn: function(){
setT3OtherBlurEvenCall();validateDistinctT3OthersN ame(this,#{storeDistinctNewTier3});
}
}
But it dint work.!!

geoffrey.mcgill
May 13, 2015, 4:37 AM
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.