开发者

Remembering the last selected month in jQuery UI datepicker across multiple fields

I have a page with multiple datepicker textfields using the standard jQuery UI. I would like to set the default datepicker date to the last selected day or month for all blank fields, so the user doesn't have to manually change the month for each datepicker they select.

I have tried storing the date value in a variable via the onSelect function of the datepicker, but am unsure how to bind the defaultDate property so it updates all datepickers with whatever the last selected date was.

Below is the basic code. Again, if a user sets one of the date textfields to 10/20/2011, when he or she opens another datepicker through any of the blank textfields the datepicker should display the month of October by default (not today's current date).

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js"></script>
    <link rel="stylesheet" type="text/css" h开发者_运维百科ref="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.0/themes/blitzer/jquery-ui.css" />

    <script type="text/javascript">
        $(document).ready(function() {

            $(".datepicker").datepicker({
                changeMonth: true,
                changeYear: true
            });
        });
    </script>
</head>

<body>

    <input type="text" class="datepicker" /> <br />
    <input type="text" class="datepicker" /> <br />
    <input type="text" class="datepicker" /> <br />
    <input type="text" class="datepicker" /> <br />
    <input type="text" class="datepicker" />

</body>

</html>


How about:

$(".datepicker").datepicker({
    changeMonth: true,
    changeYear: true,
    onSelect: function(dateText, inst) {
        $(".datepicker").datepicker("option", "defaultDate", dateText);
    }
});

Using the defaultDate option and the onSelect event.

Here's a working example: http://jsfiddle.net/MXHdj/

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜