1

code:

<script>
    $(document).ready(function(){
        var events = [{Title:"Delhi Sight Seeing – Jama Masjid, Rajghat, President House, India Gate & Qutab Minar",Duration:"3 days, 2 nights",Date:new Date("08/29/2018"),End:new Date("08/31/2018")}];

        $("#calen").datepicker({
            beforeShowDay: function(date) {
                var result = [true, '', null];
                var matching = $.grep(events, function(event) {
                    return event.Date.valueOf() === date.valueOf();
                });
                if (matching.length) {
                    result = [true, 'highlight', null];
                }
                return result;
            },
            onSelect: function(dateText) {
                var date,
                selectedDate = new Date(dateText),
                i = 0,
                event = null;
                while (i < events.length && !event) {
                    date = events[i].Date;
                    if (selectedDate.valueOf() === date.valueOf()) {
                        event = events[i];
                    }
                    i++;
                }
                if (event) {
                    alert(event.Title);
                    alert(event.Duration);
                }
            }
        });
    });
</script>

I have created event calendar which is work perfectly for single date now I want to show those dates and onclick on any dates they show event title.

For example: suppose Date is 08/29/2018 and End is 08/31/2018. Then calendar must highlights these dates 08/29/2018,08/30/2018 and 08/31/2018.
So, How can I do this ?

AymDev
  • 6,626
  • 4
  • 29
  • 52
omkara
  • 974
  • 5
  • 24
  • 50

0 Answers0