Access parent radgrid datasource from child RadMaskedTextBox in aspx page

2 posts, 0 answers
  1. Neil
    Neil avatar
    14 posts
    Member since:
    Mar 2019

    Posted 05 Nov 2019 Link to this post

    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?

     

     

  2. Eyup
    Admin
    Eyup avatar
    3918 posts

    Posted 08 Nov 2019 Link to this post

    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

    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top