RadMonthYearPicker own textbox

9 posts, 0 answers
  1. Daniel
    Daniel avatar
    35 posts
    Member since:
    Jan 2011

    Posted 26 Nov 2012 Link to this post

    Hello Community,

    i hope you can help me.

    Is it possible to use my own Textbox for RadMonthYearPicker?

    I need this because i have some css classes that not work with the default textbox of the RadMonthYear Control.
    Or i don't know how.

    I'm thankful for any Idea!
    Danny
  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 26 Nov 2012 Link to this post

    Hi Daniel,

    I suppose you want to use a TextBox with  RadMonthYearPicker. Following is the sample code that I tried to achieve your scenario.

    CSS:
    <style type="text/css">
        .rcInputCell
        {
            visibility:hidden !important;
            width:0px !important;
        }
    </style>

    ASPX:
    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
    <telerik:RadMonthYearPicker ID="RadMonthYearPicker1" runat="server">
        <ClientEvents OnDateSelected="OnDateSelected" />
    </telerik:RadMonthYearPicker>

    JS:
    <script type="text/javascript">
        function OnDateSelected(sender, args) {
            var txt = document.getElementById("TextBox1");
            txt.value = sender.get_dateInput().get_displayValue();
        }
    </script>

    Hope this helps.

    Regards,
    Princy.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Daniel
    Daniel avatar
    35 posts
    Member since:
    Jan 2011

    Posted 26 Nov 2012 Link to this post

    Thank you for your help, Princy.

    Yes this is what i want. The css code is working but the js code doesn't.

    I can Select a Date in the RadMonthYearPicker Control but it does not appear in the textbox.

    <asp:TextBox Width="128px" ID="tbAuszahlungsmonat" runat="server" CssClass="left tbWertINPleftDisable" Enabled="false" onblur="disableFehlerhinweis('tbAuszahlungsmonat');"></asp:TextBox>
    <telerik:RadMonthYearPicker ID="rmypAuszahlungsmonat" runat="server" Skin="Windows7" Culture="de-DE" Enabled="false">
        <ClientEvents OnDateSelected="OnDateSelected" />
    </telerik:RadMonthYearPicker>

    And then I used your JS function:

    function OnDateSelected(sender, args) {
        var txt = document.getElementById("tbAuszahlungsmonat");
        txt.value = sender.get_dateInput().get_displayValue();
    }

    What did I do wrong?
  5. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 26 Nov 2012 Link to this post

    Hi,

    After inspecting your code I have found that you are setting  the Enabled property as false for the MonthYearPicker. Please try the javascript after removing the Enabled property. Hope this helps.

    Regards,
    Princy.
  6. Daniel
    Daniel avatar
    35 posts
    Member since:
    Jan 2011

    Posted 27 Nov 2012 Link to this post

    Hi,

    yes this works.

    But now i can't disable the control as default?

    Thank you!
  7. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 27 Nov 2012 Link to this post

    Hi Daniel,

    You can disable the RadMonthYearPicker by setting the Enabled property to false. The OnDateSelected function will execute only after removing the Enabled property.

    Please elaborate your scenario if it doesn't helps.

    Regards,
    Princy.
  8. Daniel
    Daniel avatar
    35 posts
    Member since:
    Jan 2011

    Posted 28 Nov 2012 Link to this post

    Hi Princy,
    it really helps. But...

    I try to explain the scenario.

    I need the RadMonthYearPicker disabled at the beginning. I need it Only enabled when customer it needs.
    At the moment the customer can activate it by clicking on a checkbox.

    And this is my question. Is there any way in this scenario to disabled the RadMonthYeaPicker at the beginning?

    I hope you understand what i want. Sorry for my Englich

    Thank you,
    danny

  9. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 28 Nov 2012 Link to this post

    Hi Daniel,

    One suggestion is that you can disable the RadMonthYearPicker in the pageLoad event and then can enable the RadMonthYearPicker. Following is the sample code that I tried to achieve your scenario.

    ASPX:
    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
    <telerik:RadMonthYearPicker ID="RadMonthYearPicker1" runat="server">
        <ClientEvents OnDateSelected="OnDateSelected" />
    </telerik:RadMonthYearPicker>
    <asp:CheckBox ID="CheckBox1" runat="server" onClick="onClick(); return false;" />

    JS:
    <script type="text/javascript">
        function pageLoad() {
            var picker = $find("<%= RadMonthYearPicker1.ClientID %>");
            picker.set_enabled(false);
        }
        function onClick() {
            var picker = $find("<%= RadMonthYearPicker1.ClientID %>");
            picker.set_enabled(true);
        }
        function OnDateSelected(sender, args) {
            var txt = document.getElementById("TextBox1");
            txt.value = sender.get_dateInput().get_displayValue();
        }
    </script>

    Hope this helps.

    Regards,
    Shinu.
  10. Daniel
    Daniel avatar
    35 posts
    Member since:
    Jan 2011

    Posted 29 Nov 2012 Link to this post

    Hi Shinu,

    Thank you. This works for me!

    Now it's done :)

    Thank you guys.
    You've really helped me.

    Danny
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017