datetimepicker startDate

Hi,

I’m using Kartik datetimepicker https://github.com/kartik-v/yii2-widget-datetimepicker

but I’m having hard time to setup the startDate dynamically.

I need to block some dates right after the user select a radio button so I’m trying to set the startDate via javascript but doesn’t work.

I tried: $("#job-goods_ready_date").datepicker({startDate: timezone[1]});

but doesn’t work. Any clue?

Plugin documentation at https://github.com/smalot/bootstrap-datetimepicker. This plugin is great however seems to have fallen out of maintenance - originally forked from another project which with regards to dates and excluding times is well maintained. In saying that, am still using this plugin myself because of its ability to pick times

e.g.




$('#datetimepicker').datetimepicker('setStartDate', '2012-01-01');



so in your case:




$('#job-goods_ready_date').datetimepicker('setStartDate', timezone[1]);



assuming timezone[1] is a date formatted similarly as above

I did that and when I do it shows to calendars when I click on the input.

I think that would indicate a bug in your code that is seperate to your issue above. Examine your rendered html and perhaps look for 2 identical id’s or place a breakpoint on the line of plugin initialisation. Without double checking, normally kartiks plugins will add an object into your source html containing the plugin options and then use that pass that object when initializing the plugin against the target element. My thought is that plugin initialized twice against same element - not sure if possible in that plugin, but it is a possibility.

Another possibility - unchecked, I remember jqueryui could display two calendar months side by side deliberately, not sure if this plugin allows that as havn’t checked and don’t know what you are looking at to see if setting or bug.

Can you attach attach image or whole page html.

Andrew,

Please see the attached screen

https://www.dropbox.com/s/oeuzq6vd26elo23/Screenshot%202016-05-14%2009.59.06.png?dl=0

And notice that one calendar shows the today button and the other doesn’t and when I click in one of the calendar one let me select the time and the other doesn’t.

I tried this: $(’#job-goods_ready_date’).kvDatepicker(‘setStartDate’, ‘05/15/2016’);

and this $(’#job-goods_ready_date’).datetimepicker(‘setStartDate’, ‘05/15/2016’);

and it happens with both codes.

I’m using inside a FormGrid:


'attributes' => [

				'goods_ready_date' => [

					'type'=>Form::INPUT_WIDGET,

					'widgetClass'=>'\kartik\widgets\DateTimePicker',

					'options' => [

						'pluginOptions' => [

							'todayHighlight' => true,

							'todayBtn' => true,

							'format' => 'dd/mm/yyyy h:ii',

							'autoclose' => true,

						],

					],

				],

],

can u post html of rendered page?

Actually the date still didn’t work. Now it’s showing only one calendar but the setStartDate and time didn’t work. This is part of my HTML. The scripts are generated automatically.




<script type="text/javascript">


var datetimepicker_2fcf4034 = {"todayHighlight":true,"todayBtn":true,"autoclose":true};


jQuery("#w7").kvFormBuilder({});

if (jQuery('#job-goods_ready_date').data('datetimepicker')) { jQuery('#job-goods_ready_date').datetimepicker('destroy'); }

jQuery("#job-goods_ready_date-datetime").datetimepicker(datetimepicker_2fcf4034);


</script>	





<div class="col-sm-6">


		

<div class="form-group field-job-goods_ready_date">

<label for="job-goods_ready_date" class="control-label">Goods Ready Date</label>

<div class="input-group date" id="job-goods_ready_date-datetime"><span title="Select date &amp; time" class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span><span title="Clear field" class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span><input type="text" data-krajee-datetimepicker="datetimepicker_1c87148e" name="Job[goods_ready_date]" class="form-control" id="job-goods_ready_date"></div>

<div class="help-block"></div>


</div>


	</div>



Andrew,

I looked at the html and I found a code there that gave me an idea

This is what I put and it works now. It only shows one calendar.




if ($('#job-goods_ready_date').data('datetimepicker')) { 

  $('#job-goods_ready_date').datetimepicker('destroy');

  $('#job-goods_ready_date').datetimepicker('setStartDate', '15-05-2016 19:00:00'); 

}



I also would like to set the time. Users cannot choose any time before 19:00hrs and that part is not working now, only the date. Any idea?

Andrew,

Do you have any other input on this?