ahosam
ahosam

Reputation: 97

jQuery Retain DatePicker Date text into a textbox after postback

Retain DatePicker Date text into a textbox after postback, I am trying hard to understand how to retain a DatePicker date into a textbox after postback.

$(function () {
    $("#Arrival").datepicker({
        minDate: 0,
        dateFormat: 'dd/mm/yy',
        showOn: "button",
        buttonImage: "img/ui_cal_icon.gif",
        buttonImageOnly: true,
        buttonText: "Select date"
        
    });
});
                            <input class="calendarr font" name="Arrival" readonly  type="text" id="Arrival" onchange="changedDate()">

<input type="submit" class="btns" value="Search"  />

I have tried with many options which did not work.

Do you have any suggestion? Thanks .

Upvotes: 2

Views: 1519

Answers (3)

Tummala Krishna Kishore
Tummala Krishna Kishore

Reputation: 8271

Try to load your DatePicker as follows

$(document).ready(function () {

           Sys.Application.add_load(function () {

          $("#Arrival").datepicker({
        minDate: 0,
        dateFormat: 'dd/mm/yy',
        showOn: "button",
        buttonImage: "img/ui_cal_icon.gif",
        buttonImageOnly: true,
        buttonText: "Select date"

        });

           });

       });

Upvotes: 0

Rohith K P
Rohith K P

Reputation: 3561

    //on submit
    // Store
    localStorage.setItem("inputVal", $('calendarr').val());

    //on page load
    // Retrieve
    var storedVal = localStorage.getItem("inputVal");
    $('calendarr').val(storedVal);

Assuming you are using jquery UI datepicker.

//to store data on date change
    $("#Arrival").datepicker({
        onSelect: function(dateText, inst) {
            var date = $(this).val();
             localStorage.setItem("inputVal", date);
        }
    });

To initially populate data from LS

$( document ).ready(function() {
  $('#Arrival').datepicker("setDate", localStorage.getItem("inputVal") );
});

Upvotes: 2

Erick Boshoff
Erick Boshoff

Reputation: 1583

Here try this:

BEFORE POSTBACK (JAVASCRIPT)

function changedDate() {
    window.localStorage.setItem("Arrival", $("#Arrival").val());
}

<input class="calendarr font" name="Arrival" readonly  type="text" id="Arrival" onchange="changedDate()">

AFTER POST BACK (JAVASCRIPT)

$("#Arrival").val(window.localStorage.getItem("Arrival");

Upvotes: 0

Related Questions