I have added the following code in the textfield (datetime-local) to disable the past dates:
inputProps={{
min: new Date().toISOString().slice(0, 16),
}}
But It only disable the past dates. I also want to disable the past time.
Related
How do i change an icon and a text according to the current date?
For example lets say icon A and a text that says this is the first part of the year appears from January first to June 30th. How do I write my code in flutter so the text changes to this is the second part of the year and then the icon changes to icon B when the current date is July to December. Also, I don't want the code to take the current date from the location of the phone. I want to use the current date of the time zone utc+1.
Also, I got a flutter package for a clock.
Here is the link clock package.
The documentation of the package is not really that detailed. How do I code the clock so it doesn't show the current time of the phone but the current time of a particular time zone I choose. eg utc+1. Thanks a lot for your time.
You can check the month of the current time adjusted per your requirements and display the correct text/icon. Here is an example of how to handle the text. You would follow the same approach for the icon and any other adjustments you'd want to make.
#override
Widget build(BuildContext context) {
final now = DateTime.now().toUtc().add(const Duration(hours: 1));
return Text(
now.month < 7
? 'This is the first half of the year'
: 'This is the second half of the year',
);
}
I want to initialize and destroy datepicker in materializecss. I know how to initialize but unable to find it how to destroy.
I have one textbox and one dropdown.based on dropdown, the textbox type is changed. so when user select dob, I initialized textbox with materializecss datepicker but after that I am not able to change textbox back to its normal mode, I mean where user can insert text or number.
I am using below code to initialize -
$('#txtDatePicker').pickadate({
selectMonths: true, // Creates a dropdown to control month
selectYears: 100 // Creates a dropdown of 15 years to control year
});
A datepicker usually has 3 buttons, however if these buttons are initialized without values ie. today: "" they will not be shown.
$('.datepicker').pickadate({
today: '',
clear: 'Clear selection',
close: 'Cancel'
});
For more information see: http://amsul.ca/pickadate.js/date/#buttons
From your comment
so lets say you have initialized date picker and now I want to destroy it, so that simple text can be written into it.
I think that if you only need a simple text can be written into it. Just add an option like this
$('.datepicker').pickadate({
editable: true
});
Is there any way to change the date (value returned by getDate) pressing the change month arrows without using setDate?
It's not much clear your request..try to specify better; anyway see the documentation about datepicker https://jqueryui.com/datepicker/#dropdown-month-year
when using datepicker (jquery ui 1.10.3) it opens up with default highlight on today and that's fine.
Now, the user want to choose other date - but the initial highlight still remains on today.
I'm searching in their documentation and in general (newbie in js and all) and can't reach the answer..
Edit - this is weird cause according to their example it should work out of the box http://jqueryui.com/datepicker/#inline
One possible solution is to add a class to a datepicker-wrapping element when the user selects a date and adjust the CSS:
$(document).ready(function () {
$('#txtDate').datepicker({
onSelect: function() {
$("#txtDate").addClass("madeSelect");
}
});
});
Necessary CSS adjustment for .ui-datepicker-today : set the background to the background-image of the default-date according to the theme you're using.
Necessary CSS adjustment for .ui-datepicker-today.ui-datepicker-current-day (in case the user selects the current day): set the background to the theme's background-image of .ui-datepicker-current-day and the color of the font to your theme's color for the current day.
.madeSelect .ui-datepicker-today .ui-state-highlight
{
background: url("http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/sunny/images/ui-bg_gloss-wave_60_fece2f_500x100.png") repeat-x scroll 50% 50% #fece2f;
}
.madeSelect .ui-datepicker-today.ui-datepicker-current-day .ui-state-highlight
{
background: url("http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/sunny/images/ui-bg_inset-soft_30_ffffff_1x100.png") repeat-x scroll 50% 50% #ffffff;;
color: #0074c7;
}
Working Demo here: Datepicker - remove highlight on today when date is selected
I have a two kendo DatePickers to select start and end date of a job. job consists of multiple tasks which contains its own completion date (tasks are listed in a grid with kendo DatePicker for each record to select the completion date)
I set max and min of each task when user sets the job start and end date. I use kendo to bind data with kendo (through kendo knockout).
problem is when user clears the end date of a job,I set the max date of task level DatePicker to (2099, 11.31), but when I click on the task level datepicker I cant navigate to next month at once. if i click on some other datepicker can navigate. this happens when I delete start or end date of the job level.
Well this question doesn't seem to be 'active' anymore but for reference, I managed to get around the problem by calling .enable() on the kendo control after setting the new value (I was using ko + ko-kendo but other than that it's exactly the same)
Fiddle: http://jsfiddle.net/AlexPaven/m5M46/2/
Code in fiddle:
var vm = {
val: ko.observable(new Date()),
mx: ko.observable(new Date())
};
ko.applyBindings(vm);
setTimeout(function() {
vm.mx(new Date(2099, 11, 31));
var d = $('#a').data('kendoDatePicker');
d.enable(); // commenting this exhibits the problem - max constraint isn't updated visually
}, 3000);
I'm reasonably sure this has no side effect; if you want to preserve the enabled state I'm sure you can check the state and call enable+disable or disable+enable.
Jeez, this was annoying.
EDIT: wrong, I was fooled by the behavior which is a little more involved. You only get the bug if you open the datepicker each time you set a new maximum; the first time the change is acknowledged but subsequent times it's not. I'll spend a few more minutes with this I suppose...