How to get the Element Id of Control in UserControl using JavaScript in Ext.net

Question

Hai,

I am Writing Age calculation based on DateField value using JavaScript function and trying to fill the value in another Numeric textBox. using the following code.

<script>

        function getAge(event, toolEl, panel, tc) {
            debugger;
            var today = new Date();
            var birthDate = new Date(event.getValue());
            var age = today.getFullYear() - birthDate.getFullYear();
            var m = today.getMonth() - birthDate.getMonth();
            if (m < 0 || (m === 0 && today.getDate() < birthDate.getDate())) {
                age--;
            }
            if (event.name == 'dtMotherDOB') {
                Ext.getCmp('txtMotherAge').setValue(age);
            }
            else
                Ext.getCmp('txtFatherAge').setValue(age);
            return age;
        }


    </script>


 <ext:DateField ID="dtFatherDOB" runat="server"  FieldLabel="Father DOB"  
                                        Vtype="daterange" EndDateField="dtDOB" EnableKeyEvents="true">
         <Listeners>
                 <Select Fn="getAge"/>
        </Listeners>
  </ext:DateField>

  <ext:NumberField ID="txtFatherAge" runat="server" FieldLabel="Father Age"                       Width="300"  MinValue="20">

    </ext:NumberField>

In above code after selecting the DataField value the i am filling the txtMotherAge value in textBox .

using the above code. Ext.getCmp('txtFatherAge').setValue(age); is used to get the element from form and setting the value of age in textbox .

The above code is working fine for the simple form.

but when i use this code in UserControl and consume the usercontrol in anotherform. Ext.getCmp('txtFatherAge').setValue(age) showing error and Ext.getCmp('txtFatherAge') value becomes 'undefined' .

what is the problem in the above code. how to get the element in usercontrol in ext.net control.

Please help me in this regard.

Thank you.

Answer 1

Try this:

Ext.getCmp('<%=UserControl1.ClientID%>' + '_' + 'txtFatherAge').setValue(age)

Or,

Set ClientIDMode="Static"

<ext:NumberField ID="txtFatherAge" ClientIDMode="Static" runat="server"    
 FieldLabel="Father Age" Width="300"  MinValue="20"></ext:NumberField>