I saw a jQuery library here for date and I set it with default date.
this is for set current date:
$(document).ready(function () {
$("#enddate").pDatepicker({
persianDigit: true,
viewMode: "year",
position: "auto",
autoClose: true,
format: false,
observer: false,
altField: false,
format : "YYYY-MM-DD HH:mm:ss",
inputDelay: 800
});
});
for "YYYY-MM-DD HH:mm:ss" format I want set my custom year like
(1392-12-11 13:51:11)
according the DOC,It says I must use
$( "#enddate" ).pDatepicker("setDate",[1392,12,11,13,51,11] );
but it does not work.
how can combine these codes?
this is html code:
<input type="text " placeholder="pick up date" id="enddate" name="enddate" tabindex="8">
You are missing one option. If you want to set also the time, not just the date, you need to enable the timePicker.
The documentation is not very clear about it.
You need to add this line to the DatePicker initialisation
timePicker: {enabled: true}
So it will look like this:
$("#enddate").pDatepicker({
persianDigit: true,
viewMode: "year",
position: "auto",
autoClose: true,
format: false,
observer: false,
altField: false,
format : "YYYY-MM-DD HH:mm:ss",
inputDelay: 800,
timePicker: {enabled: true}
});
You also have more options, for the timePicker, and you should define them on the initialisation. Check the documentation to see more options.
Since you already fixed the typo, I only leave this comment:
For javascript coding standards you should use CamelCase, so the id should be endDate. This will make your code easier to read.
Related
I have a bootstrap datepicker (* Datepicker for Bootstrap v1.9.0 (https://github.com/uxsolutions/bootstrap-datepicker))
I need Monday to be displayed first instead of Sunday.
I've tried this: included bootstrap-datepicker.en-GB.min.js file (in which weekstart=1); then wrote the following in my script:
<script>
$('.datepicker').datepicker({
format: 'dd/mm/yyyy',
todayHighlight: 'TRUE',
autoclose: true,
language: "en-GB",
locale: "en-GB",
weekStart: 1,
})
</script>
Help please
Try , instead of weekStart: 1 use firstDay: 1
$('#eventDate-container .input-group.date').datepicker({
weekStart: 1, // calendar starts on Monday
autoclose: true,
todayHighlight: true,
startDate: "4/10/2017", // disables all dates prior to this date
datesDisabled: ['01/01/1970', '12/31/2099'] // placeholder sample for possible future use
});
first i think that what you need is a "jquery" code not in "PHP"
, you can disable previous dates from jquery datepicker by using minDate: option
like :
var tardate = new Date("4/10/2017");
$("#eventDate-container").datepicker({
weekStart: 1, // calendar starts on Monday
autoclose: true,
todayHighlight: true,
minDate: tardate,
});
here's jsfiddle link
I want to disable dates before today but dont work with min and max.
view:
<input id="date_modified" type="text" class="form-control" value="">
jquery:
$('#date_modified').persianDatepicker({
observer: true,
format: 'YYYY/MM/DD',
min: [1396,2,10],
max: [1396,2,20]
}).pDatepicker('setDate', [today]);
});
try this
$('#date_modified').persianDatepicker({
observer: true,
format: 'YYYY/MM/DD',
min: [1396,2,10],
max: [1396,2,20],
minDate: new Date()
}).pDatepicker('setDate', [today]);
});
Use the minDate property in JQuery UI datepicker API.
Use minDate:0 in your jQuery function.
$('#date_modified').persianDatepicker({
observer: true,
format: 'YYYY/MM/DD',
min: [1396,2,10],
max: [1396,2,20]
minDate:0
}).pDatepicker('setDate', [today]);
});
I used daterangepicker for my application.
Below code works fine as expected.on load it picks today date and displays. But, i need to show only 'placeholder' value. Not date.
When i use autoUpdateInput : false, it shows 'placeholder' value onload. But, after dates are picked, selected date values are not getting inserted.
Is it possible to do autoUpdateInput: false and autoApply: true make work as expected for my application?
Thanks
JS:
$('input[name="Two way"]').daterangepicker({
"autoApply": true,
"minDate": today,
"locale": {
format: 'DD MMM YYYY'
}
});
You can use function(start,end) {} for this.
Look at this:
$('#start_date').daterangepicker({
"showDropdowns": true,
"autoApply": true,
locale: {
format: 'DD/MM/YYYY'
},autoclose: true,
"alwaysShowCalendars": true,
"startDate": '<%= start_date %>',
"endDate": '<%= end_date %>'
}, function(start, end) {
$("#start_date_input").val(start.format('DD/MM/YYYY'));
$("#end_date_input").val(end.format('DD/MM/YYYY'));
Materialize.updateTextFields();
}
);
$('#start_date').on("change", function(){
console.log("changes");
});
Answer of 3rd point-
Yes it is possible to use autoApply=true & autoUpdateInput=false both at same time.
for this you just need to put autoApply parameter before autoUpdateInput
Look at this:
$('input[name="Two way"]').daterangepicker({
autoApply: true,
autoUpdateInput: false,
minDate: today,
locale: {
format: 'DD MMM YYYY'
}
});
Demo and full code is like this : http://fiddle.jshell.net/oscar11/dgb09c5c/5/
My Javascript code is like this :
$('#time-start').datetimepicker({
format: 'yyyy-mm-dd hh:ii:ss',
autoclose: true,
pickerPosition: "bottom-left",
maxView: 3,
minuteStep: 1,
minDate: new Date()
})
How to disable date before today?
I add minDate: new Date(), but it's not working
Any solution to solve my problem?
From Bootstrap datetime picker documentation
$.fn.datetimepicker.defaults = {
maskInput: true, // disables the text input mask
pickDate: true, // disables the date picker
pickTime: true, // disables de time picker
pick12HourFormat: false, // enables the 12-hour format time picker
pickSeconds: true, // disables seconds in the time picker
startDate: -Infinity, // set a minimum date
endDate: Infinity // set a maximum date
};
I modified your Fiddle. Is it what you are looking for? http://fiddle.jshell.net/dgb09c5c/6/