render callback with multiple month and selectmultiple

GoogleCodeExporter commented 8 years ago

I am trying to use 2 months, allow select multiple and display already 
selected days.

I set the caldendar with 2 months and select multiple, it was ok. When I 
added the render call back , I see both months during the render (i 
inserted an alert function), but when it's finished, only one month is 
displayed, I cannot go to next month and I cannot select or unselect days.

This is my code

<script type="text/javascript" src="../fonctions/jquery.js"></script>

    <!-- required plugins -->
    <script type="text/javascript" 
src="../fonctions/datesPicker/date.js"></script>
    <!--[if IE]><script src="../fonctions/datesPicker/jquery.bgiframe.js" 
type="text/javascript"></script><![endif]-->

    <!-- jquery.datePicker.js -->
    <script type="text/javascript" 
src="../fonctions/datesPicker/jquery.datePicker.js"></script>
    <script src="../fonctions/datesPicker/jquery.datePickerMultiMonth.js" 
type="text/javascript"></script>

    <!-- datePicker required styles -->
        <link rel="stylesheet" type="text/css" media="screen" 
href="../fonctions/datesPicker/datePicker.css">

    <script language="javascript" type="text/javascript">

      $(function() {
      $('#multimonth')
            .datePickerMultiMonth(
              {
                numMonths: 2,
                inline: true,
                selectMultiple : true
              })
            .bind(
            'click',
            function() {
              $(this).dpDisplay();
              this.blur();
              return false;
            }
        )
        .bind(
                'dateSelected',
                function(e, selectedDate, $td) {
                  console.log('You selected ' + selectedDate);
                }
            )
              .renderCalendar({ renderCallback: 
markBankHolidays }
            )
            ;
      });

      var markBankHolidays = function($td, thisDate) {
        var maDate = thisDate.getDate() + '/' + thisDate.getMonth() + '/' 
+ thisDate.getFullYear();
        if (bankHolidays[maDate]) {
          $td.addClass('bank-holiday');

        } 
        //alert("ici" + maDate);
      }

      var bankHolidays = {};
      bankHolidays['11/10/2009'] = 'New Year\'s day';

    </script>

    <style type="text/css">
          #multimonth {
              border: 2px solid #000;
              overflow: auto;
              float: left;
          }
          .dp-applied {
              float: left;
          }
          table.jCalendar {
              border: none;
          }
          .dp-popup-inline {
              height: 160px;
          }
          table.jCalendar td.bank-holiday {
              border: 3px solid #f00;
          }
        </style>
</head>
<body>
<div id="multimonth">
</div>

thanks in advance for your help

Christophe

Original issue reported on code.google.com by cli...@gmail.com on 9 Nov 2009 at 11:16

GoogleCodeExporter commented 8 years ago

Can you supply a URL showing the problem. The code you have supplied above is
incomplete and I can't help to debug it. It also doesn't seem like you are ever
applying the renderCallback...

Original comment by kelvin.l...@gmail.com on 9 Nov 2009 at 11:46

GoogleCodeExporter commented 8 years ago

Hi Kelvin,
Thanks for your reply 
Here is a URL with my problem

http://www.sokhar.com/yahtec/test/test.htm

When I click on a date in the caldendar, a new one appears, with next and prev 
arrows and the dates can be selected...

Thanks in advance for your help

PS : I would like also to use it with the datePickerMultiMonth plugin

Original comment by cli...@gmail.com on 9 Nov 2009 at 1:04

GoogleCodeExporter commented 8 years ago

Hi Kelvin,
Did you had time to have a look to mu issue ?
I think that I apply the renderCallback :
.renderCalendar({ renderCallback: 
markBankHolidays }
)
;

Did I missed something else ?

Thanks in advance
Christophe

Original comment by cli...@gmail.com on 10 Nov 2009 at 10:20

GoogleCodeExporter commented 8 years ago

You add the renderCallback in the settings object you pass into datePicker (or
datePickerMultiMonth) - you don't need to call renderCalendar.

e.g.

http://www.kelvinluck.com/assets/jquery/datePicker/v2/demo/datePickerCustomCellR
ender.html

Original comment by kelvin.l...@gmail.com on 10 Nov 2009 at 12:32

Changed state: Invalid

parmarmayur9090 / jquery-datepicker

render callback with multiple month and selectmultiple #137