简体   繁体   中英

Redirecting to new page when clicked on a date in datepicker

I wrote a code for opening the date picker when clicked on the image:
Here is the screen shot:
IMG1
IMG2
And here is the code:
HTML

<div style="position: absolute; top: 127px; left: 31px;">Click
            on image to enter period start date:</div>

        <img src='./img/calendar.png' id="datepickerImage"
            style="position: absolute; top: 160px; left: 126px; height: 75px;" />  

javascript

$(document).ready(function() {
                $("#datepicker").datepicker({
                    changeMonth : true,
                    changeYear : true,
                }).hide().click(function() {
                    $(this).hide();
                });

                $("#datepickerImage").click(function() {
                    $("#datepicker").show();
                });

            });  

The datepicker opens successfully. When any date on the datepicker is clicked, I want it to be redirected to next page. How can I do it?

   $('#datepicker').datepicker({
                changeMonth : true,
                changeYear : true,
            }).on('changeDate', function (e) {
       window.open("yourURL", "_self");
   });
   $("#datepickerImage").click(function() {
                $("#datepicker").show();
            });
        });

More info on window.open here http://www.w3schools.com/jsref/met_win_open.asp

use onSelect method.

onSelect Type: Function() A callback function when a date is selected. The function receives the date text and date picker instance as parameters.

As @Learner has mentioned in comment with fiddle link.

And to redirect use window.location.href with full url.

window.location.href= 'http://www.google.com'

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM