Vuetify datepicker year only max date doesn't trigger vuex state mutation - datepicker

I have written a small example where I try to update a vuex state for year, by triggering the relevant vuex mutation by selecting the year via a vuetify date-picker (year only). It works quite well except for the curiosity that the ONLY! the max date of the datepicker does not trigger the mutation to change the state. I hope someone has a hint why that is and what I can do, need to mention that the calendar opens by clicking the calendar icon, here is the example:
https://codesandbox.io/embed/vuetifydialogexample-9l619?fontsize=14

If you look at source code, it will compare string
export default function isDateAllowed (date: string, min: string, max: string, allowedFn: AllowedDateFunction | undefined) {
return (!allowedFn || allowedFn(date)) &&
(!min || date >= min) &&
(!max || date <= max)
Your date format is 2020-NaN-NaN, so your comparison:
"2020-NaN-NaN" <= "2020" // false, that's why you can't select 2020
"2019-NaN-NaN" <= "2020" // true, you can select 2019
One dirty way to fix is changing your max value to 2020-NaN-NaN
<v-date-picker
reactive
show-current
ref="picker"
v-model="date"
min="2018-NaN-NaN"
max="2020-NaN-NaN"
no-title
>
</v-date-picker>

Related

DateRangePicker - Grey out unavailable dates

As the title suggests I am using DateRangePicker to add date ranges to an array. If possible I would like to be able to "grey" out already selected dates in the array. Is there anyway to do this?
Here is the solution to returning the dates in-between the range in case anyone else needs it.
List<DateTime> getDaysInBetweenIncludingStartEndDate(
{required DateTime startDateTime, required DateTime endDateTime}) {
// Converting dates provided to UTC
// So that all things like DST don't affect subtraction and addition on dates
DateTime startDateInUTC =
DateTime.utc(startDateTime.year, startDateTime.month, startDateTime.day);
DateTime endDateInUTC =
DateTime.utc(endDateTime.year, endDateTime.month, endDateTime.day);
// Created a list to hold all dates
List<DateTime> daysInFormat = [];
// Starting a loop with the initial value as the Start Date
// With an increment of 1 day on each loop
// With condition current value of loop is smaller than or same as end date
for (DateTime i = startDateInUTC;
i.isBefore(endDateInUTC) || i.isAtSameMomentAs(endDateInUTC);
i = i.add(const Duration(days: 1))) {
// Converting back UTC date to Local date if it was local before
// Or keeping in UTC format if it was UTC
if (startDateTime.isUtc) {
daysInFormat.add(i);
} else {
daysInFormat.add(DateTime(i.year, i.month, i.day));
}
}
return daysInFormat;
}
Yes, you can send disabled dates into the component.
Check this sample of the documentation.
For further options, check the whole docs.

Rails Add TimeStamp to DatePicker Date From Form

I'm using rails 5.2.4.4 and ruby 2.6.4
I'm using the JQuery DatePicker on a form. It is giving me a date in the format: mm/dd/YYYY. What I need to do is add a time-stamp to that so I can make the date look like 01/12/2021 23:23:59. I thought I could add the end_of_day method in a before_hook call, but rails does not like that:
# in model:
validates :end_date, :presence => true
before_save :set_end_date_timestamp
def set_end_date_timestamp
if self.end_date?
self.end_date.end_of_day!
end
end
That gives me an error: NoMethodError (undefined method 'end_of_day!' for Tue, 12 Jan 2021 00:00:00 EST -05:00:Time)
What am I doing wrong? And, what is the most railsie way to accomplish this?
Found this:
<script>
// make date format user friendly: mm/dd/yyyy
$("#course_swap_request_date_start_date").datepicker(
{ dateFormat: "mm/dd/yy 00:00:01" }
);
$("#course_swap_request_date_end_date").datepicker(
{ dateFormat: "mm/dd/yy 23:59:59" }
);
</script>
For my specific app, I need to set the start_date timestamp to 00:00:01 and the end_date timestamp to 23:59:59. I could not get beginning_of_day and end_of_day to work. Since DatePicker allows us to set the timestamp this way, it was an easy way to do this, albeit a bit of a cheap-hack.

How do I trigger an event in Knockout JS for a date input?

What I want to accomplish is to trigger an event when the user selects a date from a date input field in HTML using KnockoutJS. Regardless of the date the user chooses, I want to set the first day of the selected month.
I don't want to post the date field on a form yet. I want the event to be triggered when the user just selects the date from the input field.
If you bind the value of the date input to an observable, you can subscribe to changes on that observable and change the value to the first day of the selected month.
This is more straightforward than the answer that I had previously written here.
const vm = {
theDate: ko.observable('')
};
vm.theDate.subscribe(function(newValue) {
vm.theDate( newValue ? newValue.replace(/\d\d$/, '01') : '');
});
ko.applyBindings(vm);
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<input type="date" data-bind="value: theDate">

How to assign current date to a date field in odoo 10

How to show current date before clicking the date field in odoo?
Odoo Date field class provides methods to get default values for like today.
For dates the method is called context_today() and for datetimes context_timestamp(). You are able to pass a timestamp to this methods to either get today/now (without timestamp) or a timestamp which will be formed by the logged in users timezone.
Code Example:
from odoo import fields, models
class MyModel(models.Model):
_name = 'my.model'
def _default_my_date(self):
return fields.Date.context_today(self)
my_date = fields.Date(string='My Date', default=_default_my_date)
Or the lambda version:
my_date = fields.Date(
string='My Date', default=lambda s: fields.Date.context_today(s))
I found it.It is Simple, just write this on your python code like:
date = fields.Datetime(string="Date", default=lambda *a: datetime.now(),required=True)
or
like this
date = fields.Datetime(string="Date current action", default=lambda *a: datetime.now())
or
like this
date = fields.Date(default=fields.Date.today)

Gravity Forms Date Push Reservations

I currently use GF for reservations 'Arrive' and 'Departure'. I would like the date displayed on the 'Departure' to always be one date ahead of the 'Arrival' date, regards of what date the guest picks. Then can pick a custom 'Departure' date, but as a default I'd like to show one date forward of the 'Arrival' date no matter what 'Arrival' date they choose.
This is possible with the gform_datepicker_options_pre_init JS filter. Example #3 is what you're after:
gform.addFilter( 'gform_datepicker_options_pre_init', function( optionsObj, formId, fieldId ) {
if ( formId == 12 && fieldId == 8 ) {
optionsObj.minDate = 0;
optionsObj.onClose = function (dateText, inst) {
jQuery('#input_12_9').datepicker('option', 'minDate', dateText).datepicker('setDate', dateText);
};
}
return optionsObj;
});
If you're looking for a code-less solution, I've written a plugin that let's you do this in just a few clicks called GP Limit Dates.
Also, here is an article that addresses your specific need: How to restrict dates in second date field based on date selected in first date field with Gravity Forms