RadDatePicker selected date empty after going back page

3 posts, 0 answers
  1. Peter
    Peter avatar
    12 posts
    Member since:
    Nov 2008

    Posted 21 Jan 2014 Link to this post

    Hi I've a page where user enters a date, submits it and is redirected to another page which processes report using the date submitted.
    Sometimes users click the back button and the page is populated with a previously submitted date, however the actual selected date is empty while the text is still showing the submitted date. How can I clear this? I've tried to use the Clear() method but that doesnt help.

    Also if I just delete the text the required field validator doesnt fire if returned from previous page.

       
    <telerik:RadDatePicker ID="DateFromTextBox" runat="server">
        </telerik:RadDatePicker>
        <asp:RequiredFieldValidator runat="server" ID="Requiredfieldvalidator8" ControlToValidate="DateFromTextBox"
            ErrorMessage="required" ValidationGroup="CSV">*</asp:RequiredFieldValidator>
        <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Button"
            ValidationGroup="CSV" />



    Code behind


    protected void Button1_Click(object sender, EventArgs e)
    {
        Session["Report_FromDate"] = this.DateFromTextBox.SelectedDate.GetValueOrDefault();
        Response.Redirect("~/Reports/Default.aspx");
    }


    Thank you for any suggestions.

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

    Posted 21 Jan 2014 Link to this post

    Hi Peter,

    For clearing the previously submitted date from the RadDatePicker you can write the code in JavaScript pageLoad event. For the second scenario, as a work around you can use the CustomValidator which works fine at my end. Please have a look into the sample code snippet.

    ASPX:
    <telerik:RadDatePicker ID="DateFromTextBox" runat="server">
    </telerik:RadDatePicker>
    <asp:CustomValidator ID="CustomValidator1" runat="server" ValidationGroup="CSV" ErrorMessage="*"
        EnableClientScript="true" ClientValidationFunction="Validate">
    </asp:CustomValidator>
    <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" ValidationGroup="CSV" />

    JavaScript:
    <script type="text/javascript">
        function pageLoad() {
            var datepicker = $find("<%=DateFromTextBox.ClientID %>");
            datepicker.clear();
        }
        function Validate(sender, args) {
            var datepicker = $find("<%=DateFromTextBox.ClientID %>");
            if (datepicker.get_textBox().control.get_value() == "")
                args.IsValid = false;
            else
                args.IsValid = true;
        }
    </script>

    Thanks,
    Shinu.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Peter
    Peter avatar
    12 posts
    Member since:
    Nov 2008

    Posted 22 Jan 2014 Link to this post

    Thank you very much Shinu,

    this is a great solution. I actually ended up forcing the selected date on return to the page using javascript.
    Here is the code just in case anyone is interested. The value is saved to a hidden field and then retrieved and date is re-selected.

    It would be really good if telerik could build something like this into the datepicker so the textbox can keep the value as would normal asp textbox.

    Regards
    Peter

    <telerik:RadDatePicker ID="DateFromTextBox" runat="server">
        <DateInput>
            <ClientEvents OnValueChanged="onValueChangedFrom" />
        </DateInput>
    </telerik:RadDatePicker>
     
    <asp:RequiredFieldValidator runat="server" ID="Requiredfieldvalidator8" ControlToValidate="DateFromTextBox"
        ErrorMessage="required" ValidationGroup="CSV">*</asp:RequiredFieldValidator>
    <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Button"
        ValidationGroup="CSV" />
     
    <input type="hidden" id="RadDatePickerValueFrom" value="" />
     
    <script type="text/javascript">
        function pageLoad() {
            var savedValue = $get("RadDatePickerValueFrom").value;
            var datepicker = $find('<%= DateFromTextBox.ClientID %>');
            if (savedValue !== "")
            {
                var dateParts = savedValue.split("-");
                var oldDate = new Date();
                oldDate.setFullYear(dateParts[0], dateParts[1], dateParts[2]);
                datepicker.set_selectedDate(oldDate);
            }
        }
     
        function onValueChangedFrom(sender, eventArgs) {
            var datepicker = $find('<%= DateFromTextBox.ClientID %>');
            var date = datepicker.get_selectedDate();
            $get("RadDatePickerValueFrom").value = [date.getFullYear(), date.getMonth(), date.getDate()].join("-");
        }
    </script>
Back to Top