Access parent radgrid datasource from child RadMaskedTextBox in aspx page

[Neil]

Hi,

  Pretty new to telerik. I have a radgrid which has a RadMaskedTextBox child control. I have been able to use <ClientEvents OnLoad to get the value typed into the RadMaskedTextBox using the onchanged event using clientside javascript . I also need to pass other values from the Radgrid's datasource which is a datatable. 

   I am trying to get to the radgrid datasource inside of the RadMaskedTextBox declaration using server tags and the clientid. I'm not sure this is possible or if I need to get the values in the javascript code. Here is what I am trying to do and doesn't work. It isn't complete but it's clear that what I've done so far isn't working. The cboCBH.ClientID is not returning a control but the generated RadMaskedTextBox (seen in view source) code shows "cboCBH.ClientID " and not an actual controlid. The demo.getInputValue works as long as I don't pass the $find and pass nothing. I'm trying to pass the radgrid datasource. Here's what I have so far.

 

     <telerik:RadScriptBlock runat="server" ID="whocares"><telerik:RadMaskedTextBox ID="cboCBH" runat="server" Width="80px" Mask="##.##" onchange="demo.getInputValue($find('<%=cboCBH.ClientID %>').NamingContainer)">  <ClientEvents OnLoad="demo.load" /></telerik:RadMaskedTextBox></telerik:RadScriptBlock>

 

Here's the "onload code":

      ; (function () {

            var demoInputControl;

            var id;

            var demo = window.demo = {};



            function getServerId(clientId) {

                return clientId.indexOf("_") > -1 ? clientId.replace(/.+_([a-zA-Z0-9]+)$/m, "$1") : clientId;

            }



            demo.load = function (sender, args) {

                demoInputControl = sender;

                id = getServerId(demoInputControl.get_id()) + " ";

            };



            demo.getDemoInputControl = function () {

                return demoInputControl;

            }



            demo.setInputValue = function (id2) {

                var valueTbx = $telerik.findControl(document.forms[0], id2);

                demoInputControl.set_value(valueTbx.get_value());

            }



            demo.getInputValue = function (other) {

                alert(id + "value is: " + demoInputControl.get_value());
                alert(other);

            }



            demo.setEmptyMessage = function (id2) {

                var valueTbx = $telerik.findControl(document.forms[0], id2);

                demoInputControl.set_emptyMessage(valueTbx.get_value());

            }



            demo.getEmptyMessage = function () {

                alert(id + "EmptyMessage is: " + demoInputControl.get_emptyMessage());

            }



            demo.setMaxValue = function (id2) {

                var valueTbx = $telerik.findControl(document.forms[0], id2);

                demoInputControl.set_maxValue(valueTbx.get_value());

                demoInputControl.clear();

            }



            demo.getMaxValue = function () {

                alert(id + "MaxValue is: " + demoInputControl.get_maxValue());

            }



            demo.showNumberFormat = function () {

                var numberFormat = demoInputControl.get_numberFormat();

                var output = "";



                for (var prop in numberFormat) {

                    output += prop + ": " + numberFormat[prop] + "\n";

                }

                alert(output);

            }

        })();

 

Will this work? Or do I need to get the radgrid datasource from inside a javascript function?

 

 

[Eyup]

Hi Neil,

 

Generally, you can achieve all this using server-side approach. I suppose the maskbox is inside the grid, therefore, you can use the Bind expression:
https://docs.microsoft.com/en-us/previous-versions/aspnet/ms178366(v=vs.100)

Here is a live sample you can check:
https://demos.telerik.com/aspnet-ajax/grid/examples/data-editing/form-template-update/defaultcs.aspx

Namely, this part:

                                                <telerik:RadMaskedTextBox RenderMode="Lightweight" ID="HomePhoneBox" runat="server" SelectionOnFocus="SelectAll"
                                                    Text='<%# Bind("HomePhone") %>' PromptChar="_" Mask="(###) ###-####"
                                                    TabIndex="3">
                                                </telerik:RadMaskedTextBox>

If you still want to use a client-side logic, I suggest that you try using the OnValueChanged event handler where you will have the sender object automatically:
https://docs.telerik.com/devtools/aspnet-ajax/controls/maskedtextbox/client-side-programming/events/onvaluechanged

Furthermore, this article can help you get a better grasp of accessing Telerik controls on client-side:
https://www.telerik.com/support/kb/aspnet-ajax/details/access-telerik-controls-on-client-side

And also, RadGrid provides built-in masked column if you want to check it:
https://docs.telerik.com/devtools/aspnet-ajax/controls/grid/columns/column-types#gridmaskedcolumn

I hope this info will help you out.

 

Regards,
Eyup
Progress Telerik