RadDatePicker format switiching on button click

5 posts, 0 answers
  1. William Wittsche
    William Wittsche avatar
    8 posts
    Member since:
    Aug 2009

    Posted 13 Apr 2012 Link to this post

    The date entered into the RadDatePicker in format of 04/14/2012 and when you click on the go button the displayed date changes to 2012-04-14- it then goes back to 04/14/2012.  This causes a flicker issue in the field on the go click.  Is there a setting to stop this from happening?
    <CommandItemTemplate>
        <table cellspacing="5px" cellpadding="0" style="width: 100%;height: 25px;margin: 0px;padding: 0px;border-bottom: 1px solid #cccccc;background-color: #ffffff;">
        <tr><td style="width:250px;text-align: left; padding-left: 1px;" nowrap="nowrap">
                <table cellspacing="0" cellpadding="0" border="0" style="width: 250px;height: 25px;margin: 0px;padding: 0px;border-bottom: 1px solid #cccccc;background-color: #ffffff;">
                    <tr>
                        <td style="width:100px;text-align: right; padding-left: 1px;" nowrap>
                            <telerik:RadDatePicker ID="RadDatePicker1" Runat="server" Skin="Outlook" AutoPostBack="False" Width="100">
                                <Calendar UseRowHeadersAsSelectors="False" UseColumnHeadersAsSelectors="False" ViewSelectorText="x" Skin="Outlook"></Calendar>
                                <DateInput DisplayDateFormat="M/d/yyyy" DateFormat="M/d/yyyy" AutoPostBack="False"></DateInput>
                                <DatePopupButton ImageUrl="" HoverImageUrl=""></DatePopupButton>
                            </telerik:RadDatePicker>
                        </td><td style="width:20px;text-align:left;vertical-align:middle;padding-left:1px;" nowrap="nowrap">
                            <asp:Image ID="Image1" runat="server" Height="1" Width="1" ImageUrl="images/shim.gif" />
                            <asp:Label ID="Label1" runat="server" Text="to" CssClass="LabelStyle"></asp:Label>
                            <asp:Image ID="Image4" runat="server" Height="1" Width="5" ImageUrl="images/shim.gif" />
                        </td><td style="width:100px;text-align:left;vertical-align:middle;padding-left:1px;" nowrap="nowrap">
                            <telerik:RadDatePicker ID="RadDatePicker2" Runat="server" Skin="Outlook" AutoPostBack="False" Width="100">
                                  <Calendar ID="Calendar1" UseRowHeadersAsSelectors="False" UseColumnHeadersAsSelectors="False" ViewSelectorText="x" Skin="Outlook" runat="Server"></Calendar>
                                  <DateInput ID="DateInput1" DisplayDateFormat="M/d/yyyy" DateFormat="M/d/yyyy" AutoPostBack="False"  runat="Server"></DateInput>
                                  <DatePopupButton ImageUrl="" HoverImageUrl=""></DatePopupButton>
                            </telerik:RadDatePicker>  
                       </td><td style="width:30px;text-align:left;vertical-align:middle;padding-left:1px;" nowrap="nowrap">                                                                                              
                            <asp:Button ID="cmdSearch" runat="server" Text="Go" CssClass="ButtonStyle" CommandName="Refresh" />         
                       </td>
                    </tr>
                </table>
            </td><td style="width:50%;text-align: center">
                <asp:Label ID="LabelDate" runat="server" Text="" CssClass="LabelStyle"></asp:Label>
            </td><td style="width:20%;text-align: right">
                <asp:Image ID="Image2" runat="server" Height="1" Width="20" ImageUrl="images/shim.gif" />
            </td></tr>
        </table>
    </CommandItemTemplate>

  2. Eyup
    Admin
    Eyup avatar
    3700 posts

    Posted 18 Apr 2012 Link to this post

    Hi William,

    Thank you for contacting us.

    I have tried the provided code and everything is working as expected on my side. I have attached the project for your confirmation. Can you please give it a look and tell me if the RadDatePickers work properly?

    It would be best if you can send us a runnable version of your application which demonstrates the problematic behavior. Thus we will be able to further research on the problem and do our best to provide a proper solution.

    Kind regards,
    Eyup
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  3. William Wittsche
    William Wittsche avatar
    8 posts
    Member since:
    Aug 2009

    Posted 23 Apr 2012 Link to this post

    Eyup,

    the forum only allows attachments of 2mb and only images like GIF and JPEG So I'll see about opening a support ticket and uploading a small program and video demonstarting the problem.
  4. Karthik
    Karthik avatar
    1 posts
    Member since:
    Sep 2012

    Posted 18 May 2012 Link to this post

    Hi Telerik,

    I am facing an issue with RadDateupPicker. I am enabling an Rad calender on any entry in Textbox. Initially RadDatePicker will be in Disabled mode. I have an button control associcated in the page. I can able to enable the RadDatepicker control upon entrering some data in Textbox. After performing button click in the page and remove the text from the Text box, I am not able to open the Calender Popup.

    Here is the Code:
    ASPX:
    <%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
        CodeBehind="Default.aspx.cs" Inherits="RadDatePickerEnable._Default" %>
      
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
    <asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
        <style type="text/css">
            .billReviewSearchCriteriaContDiv
            {
                position: relative;
                width: 778px;
                height: 30px;
            }
        </style>
        <script type="text/javascript">
      
            function PANCardCheck() {
      
                var panTbx = document.getElementById('<%=tbxpanNum.ClientID%>');
                var dateOfJoinTbx = $find('<%=radDateOfJoin.ClientID%>');
      
                if (panTbx.value != "") {
      
                    dateOfJoinTbx.set_enabled(true);
                    dateOfJoinTbx._popupButton.disabled = false;
                    dateOfJoinTbx._popupButton.onclick = function () { dateOfJoinTbx.togglePopup(); return false; };
      
                    dateOfJoinTbx.set_enabled(false);
                    dateOfJoinTbx._popupButton.disabled = true;
                    dateOfJoinTbx._popupButton.onclick = function () { return false; };
      
                    dateOfJoinTbx.set_enabled(true);
                    dateOfJoinTbx._popupButton.disabled = false;
                    dateOfJoinTbx._popupButton.onclick = function () { dateOfJoinTbx.togglePopup(); return false; };
      
                    var datePicker = $find('<%= radDateOfJoin.ClientID %>');
                    $find('MainContent_radDateOfJoin')._popupButton.className = 'aspNetDisabled rcCalPopup rcEnabled';
                }
                else {
                    dateOfJoinTbx.clear();
                    dateOfJoinTbx.set_enabled(false);
                    dateOfJoinTbx._popupButton.disabled = true;
                    dateOfJoinTbx._popupButton.onclick = function () { return false; };
      
                    var datePicker = $find('<%= radDateOfJoin.ClientID %>');
                    $find('MainContent_radDateOfJoin')._popupButton.className = 'aspNetDisabled rcCalPopup rcDisabled';
                }
            }
           
        </script>
    </asp:Content>
    <asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
        <cc1:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" />
        <h2>
            Rad DatePicker Control
        </h2>
        <p style="color: Green;">
            Enable or Disable RadDatePicker control on Textbox entry
        </p>
        <div class="billReviewSearchCriteriaContDiv">
            <asp:Label ID="lblSocialSecurityNum" runat="server" Text="PAN Card # :" Style="position: relative;
                left: 35px; color: black;"></asp:Label>
            <asp:TextBox ID="tbxpanNum" runat="server"  onkeyup='PANCardCheck()' onchange='PANCardCheck()'
                Style="position: relative; left: 38px; font-size: 12px; width: 130px;" MaxLength="10"></asp:TextBox>
            <asp:Label ID="lblDateOfJoin" runat="server" Text="Date of Join :" Style="position: relative;
                left: 121px; color: black;"></asp:Label>
            <telerik:RadDatePicker ID="radDateOfJoin" runat="server" MinDate="01/01/1000" Width="145px" 
                Height="14px" Skin="Web20" Font-Size="11px" DateInput-DateFormat="MM/dd/yyyy"
                Enabled="true" Style="position: absolute; left: 430px; top: 3px;">
            </telerik:RadDatePicker>
            <asp:LinkButton ID="lnkSearch" runat="server" Text="Click Here" OnClick="lnkSearch_Click" Style="position: relative; left: 380px;
                top: 3px;"   ></asp:LinkButton>
            <asp:Label runat="server" ID="lblTest" Text="" Style="position: absolute; left: 630px;
                top: 3px;"></asp:Label>
        </div>
        <div style="height: 50pt;">
        </div>
        <p>
            Initially when page loads, Rad Date Picker will be in disabled mode.</br> Upon any
            data entry in textbox, rad datecontrol should be enabled(DateInput and popupbutton)
            and user can enter the date.</br> After performing link button click 'lnkSearch' in the page and remove the text from the Text box, I am not able to open the Calender Popup.)
        </p>
    </asp:Content>

    Code Behind:

    using System;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
      
    namespace RadDatePickerEnable
    {
        public partial class _Default : System.Web.UI.Page
        {
            protected void Page_Load(object sender, EventArgs e)
            {
                ValidationCheck();
            }
      
            private void ValidationCheck()
            {
                if (tbxpanNum.Text.ToString() != "")
                {
                    radDateOfJoin.DatePopupButton.Enabled = true;
                }
                else
                {
                    radDateOfJoin.DatePopupButton.Enabled = false;
                    radDateOfJoin.DateInput.Enabled = false;
                }
            }
            protected void lnkSearch_Click(object sender, EventArgs e)
            {
                lblTest.Text = "Clicked";
            }
        }
    }




    Please do the needful.

    Thanks
    karthik
  5. Eyup
    Admin
    Eyup avatar
    3700 posts

    Posted 23 May 2012 Link to this post

    Hello Karthik,

    I have created a sample application by modifying the provided code to achieve the desired scenario. Please give it a look and let me know if you need further assistance. 

    All the best,
    Eyup
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top