What's the difference between bootstrap datepicker "setDate" and "update" methd? - javascript

I've tried to use
$element.datepicker('setDate', dateObj);
And
$element.datepicker('update', dateObj);
to set the internal date of a datepicker. But it looks like if i use setDate, the default selected date(which is the start date) is still highlighted, but update will clear the default selected date and use the new dateObj as selected
I wonder how to clear the default selected date with setDate

I've been playing around trying out different alternatives to the API and according to my findings, there's no difference between those two.
$("#calendar").datetimepicker("update",new Date());
$("#calendar").datetimepicker("setDate",new Date());
It seemed to me confusing and suspicious that they'd put in two different methods for the same task so I started asking around. By the word of mouth, I've learned that the former was originally intended to be the general setter of all properties but due to technical issues, the functionality was dropped (only retaining the date setting capability due to compatibility issues for pre-existing code).
$("#calendar").datetimepicker("update", "weekStart", 4);
The above was but isn't anymore changing the starting week of the control.

Difference between bootstrap datepicker “setDate” and “update” is as follows:
$("#calendar").datetimepicker("setDate",new Date()); = triggers an event "change"
$("#calendar").datetimepicker("update",new Date()); = no triggers an event "change"

Related

How to select a fixed time for the due date of an order if there are multiple options?

I am modelling a job shop process and use the event block to generate orders for the order arrival process. In action of the event block, the due date of the generated order has to be specified. This value however is not fixed. It should either be 17:45:00 PM, 19:15:00 PM or 20:15:00 PM. However, the possibility that time 17:45:00 is chosen should be twice as likely as the chances for choosing the other two times. How can I define the due date of an order according to these conditions?
My process looks like this
I first tried given the order a fixed due date, like this:
Order order = new Order();
// Set due date as fixed time
Calendar cal = Calendar.getInstance();
cal.set(Calendar.HOUR_OF_DAY,17);
cal.set(Calendar.MINUTE,30);
cal.set(Calendar.SECOND,0);
cal.set(Calendar.MILLISECOND,0);
order.atrDueDate = cal.getTime();
// proc time for single orders
order.varProcTime = triangular(1,2,3);
order.markParametersAreSet();
enter1.take(order);
This works, but I do not know how to choose a due date from 3 different options.
This is not the optimal answer and there are more general ways of doing this, but a simple solution would be
if(randomTrue(0.5)){//50% chances of choosing this date
cal.set(Calendar.HOUR_OF_DAY,17);
cal.set(Calendar.MINUTE,45);
}else if(randomTrue(0.5)){//25% chances of choosing this date
cal.set(Calendar.HOUR_OF_DAY,19);
cal.set(Calendar.MINUTE,15);
}else{//25% chances of choosing this date
cal.set(Calendar.HOUR_OF_DAY,20);
cal.set(Calendar.MINUTE,15);
}

Knockout and Kendo Datetimepicker resets date to today when changing time

I have page that uses the Kendo DateTimePicker with the input bound to a Knockout Observable. I am using knockout-kendo.js for the bridging.
As you can see in this JSFiddle, I set up the observable with today's date time at initialization. I later set the value (as if it was loaded from an ajax retrieval, I just didn't want to deal with the echo api on JSFiddle)
var SchedulerAppointmentModel = function () {
var self = this,
saved = [],
initComplete = false;
self.StartDateTime = ko.observable(moment().format("MM/DD/YYYY hh:mm A"));
self.StartDateTime(moment("10/23/2014 1:30 PM").format("MM/DD/YYYY h:mm A"));
};
The problem is, if I change the time in my drop down box, the date resets to today. I wanted to leave the date alone.
I think it has something to do with setting the kendoDateTimePicker in code and not in html. I think if i could somehow set the max later, it would work.
Not sure if you still need an answer, but...
I see you've pulled in the knockout-kendo library. With that there is no need to manually initialize the dateTimePicker. You can simply use the binding that comes with that library:
<input id="appt-start-datetime" value="0" data-bind="kendoDateTimePicker: StartDateTime" />
Fiddle Updated

Kendo Scheduler EditorTemplate - set recurrence date to selected date

I'm working on a Kendo Scheduler, which has a custom EditorTemplate for adding a new task. And now, if I want to make a task that has to be recursive (that is, it is should be repeated daily, weekly, etc.), it does not, as standard, set it's recursive date to the selected date, but the actual date of the week.
I have tried to comment the EditorTemplate out, and I can see that it then sets the recursive date to the selected date - so as a standard it works as it should.
I have also tried to add some JavaScript to check the correct checkbox, but I could not get that to work as well
The recursive part of the template looks like:
<div data-container-for="recurrenceRule" class="k-edit-field">
#(Html.Kendo().RecurrenceEditorFor(model => model.RecurrenceRule).Messages(m =>
SchedulerHelper.MessageLocaliztion(this, m))
.HtmlAttributes(new { data_bind = "value:recurrenceRule" }))
</div>
Any idea how to make it work as it does as standard ? Or make a EditorTemplate where you exclude the recursiveness, and it takes the standard ?
You can take help of the SchedularEvent Framework
I'm not certain this is the answer to your question, but we needed to set the change event in the kendoRecurrenceEditor (or kendoMobileRecurrenceEditor) so that when the user makes a change, it comes back into the parent event properly. This was the direction from Kendo Support.
recurrenceEditor.kendoRecurrenceEditor({
start: new Date(event.start),
value: event.recurrenceRule,
timezone: self.scheduleConfig.timezone,
messages: self.scheduleConfig.messages.recurrenceEditor,
change: function () {
event.set("recurrenceRule", this.value());
}
});

EmberJS: Bind input value to Controller property and run filter on change

I'm trying to bind a input's value to it's controller's property to keep it updated when the property changes. When the input value has changed, I then need to fire a filter method.
I found some examples, but I'm either doing something wrong or they no longer apply as they are a few months old and Ember has gone through some changes.
JSBin: http://emberjs.jsbin.com/oTiKiDI/1/edit
If you were able to manipulate the this.inputDate property directly, as you're doing in your jsbin, I believe it wouldn't properly fire any observers when you change the value. So rather than manipulating this.inputDate.anything, you should this.set('inputDate', [whatever]).
A Date().getDate() returns just the day of the month, not any usable proxy to a Date object, and adding 1 to that value will not add one day to your Date(). I prefer to use http://momentjs.com/ to manipulate dates painlessly and semantically.
http://emberjs.jsbin.com/oKehAYE/3/edit works, and has filterDate pulled out of the actions hash and turned into an observer. If you uncomment the alert() line it will do something when the inputDate changes. It probably doesn't work ideally, since when the page initially renders you have a Date object, and then once you change it you have a Moment—you might as well initialize inputDate with moment(new Date)—but I leave that as an exercise for the reader.

FullCalendar Select Method

I am creating a interactive calendar using FullCalendar but I have run into a nice to have snag.
When the person makes the hour range selection (click and drag) I have a dialog open and allows the user to title their event and modify the date/time selection if needed. What I would like is to re-render the selection with the new date/time selection from the dialog if it changes.
Currently when I run the select method my selection area is just removed from the view, I want it to stay and be updated to the current selection.
Here is my code
$('#UserCalendarToHour, #UserCalendarToMin').change(function(){
var allDay = false;
var startDate = new Date($('#UserCalendarFromDate').val()+' '+$('#UserCalendarFromHour').val()+':'+$('#UserCalendarFromMin').val());
var endDate = new Date($('#UserCalendarToDate').val()+' '+$('#UserCalendarToHour').val()+':'+$('#UserCalendarToMin').val());
if($('#UserCalendarAllDay').is(':checked')){
allDay = true;
}
$('#calendar').fullCalendar('unselect');
$('#calendar').fullCalendar('select',startDate.toString(),endDate.toString(),allDay);
});
Now what am I missing.
The select method is expecting startDate and endDate as Date objects. You're converting them to text. Also, according to docs,
allDay is a boolean indicating if entire days were selected (days in
month view or the "all-day" slot in the agenda view) or time slots
were selected.
So if you are selecting time slots you need to set it to false.
You'll see it more clearly in the select callback documentation. The same type for arguments seem to apply for the method. It took me a while to realize it. You may get confused with, for instance, the Event Object attributes, which have similar names but are of different type. See it here:
http://arshaw.com/fullcalendar/docs/selection/select_callback/

Categories