Right now when I click on the date control, I start up at the year 2000! How can I tell it to start showing the current month of the current year?
Thanks!
<script type="text/javascript">
$(document).ready(function () {
$('#DOB').datepicker({ defaultDate: null });
});
</script>
With the code above when I click the control I get July 2000 as the starting date.
Set the defaultDate parameter. This works if the attached field is blank. See here:
http://docs.jquery.com/UI/Datepicker#option-defaultDate
Related
I want to take two date string with textbox or editor in mvc.
The format should be
"MM/yyyy-MM/yyyy".
I need to force the user for entering the input like above format without posting model.
#Html.TextBox("tbxDateRange", "", "{0:dd/MM/yyyy}", new { #class = "form-control dropdown", placeholder = "MM/yyyy - MM/yyyy" })
Above code not working event get just a formatted date string.
The format is working as expected. You are telling tbxDateRange's value (the zero in the third parameter ("{0:dd/MM/yyyy}") to format as day/month/year. It will therefore take the input in the text box and display it in that format.
It is only a display format. It will not enforce this format. For that you will need to do your own client side javascript (since you mentioned without posting the model). You could look at using a masked input element. ASP.NET MVC does not have a masked input out of the box.
You could use a masked input control like maskedinput which is a plugin for jQuery.
Additionally, you might want to look at breaking this up into two controls. One for the start and one for the end. You could consider using the html5 input type of date and you will automatically get a calendar. Although, if the day of the month will be too confusing for your users/UI then you could look at using jquery UI's datepicker and you can configure it to show only month and year.
Once you include jQuery UI in your app you would do something like jQuery UI DatePicker to show month year only.
In that example the winning answer formats the control in such a way to only show the month and year items of the control.
<script type="text/javascript">
$(function() {
$('.date-picker').datepicker( {
changeMonth: true,
changeYear: true,
showButtonPanel: true,
dateFormat: 'MM yy',
onClose: function(dateText, inst) {
$(this).datepicker('setDate', new Date(inst.selectedYear, inst.selectedMonth, 1));
}
});
});
</script>
<style>
.ui-datepicker-calendar {
display: none;
}
</style>
I recently found the mobipick calendar and I really like it due to its fast performance.
However I am having some trouble setting the minimum date four days from now.
If you go on the mobipick website, you can add min="..." in the html attribute, but it doesn't specify today's date.
The following code can be found on the website as well,
how can I achieve this?
Javascript/Jquery
<script type="text/javascript">
$(document).ready(function () {
var picker = $("#picker", this);
picker.mobipick();
picker.bind("change", function () {
var date = $(this).val();
// formatted date
var dateObject = $(this).mobipick("option", "date");
});
});
</script>
HTML
<input id="picker" type="text" />
In order to set the min date four days from now, create an input element
<input type="text" />
and add this JavaScript
$( selector ).mobipick({
minDate: (new XDate()).addDays( 4 )
});
You need version 0.6 for this example to work, download or fork at GitHub https://github.com/sustainablepace/mobipick. I've also added a working example at http://mobipick.sustainablepace.net/demo-advanced.html, see section "Datepicker with dynamic min date".
Let me know if this works for you.
I have a jQuery UI datepicker on my page and I set a defaultDate using the below code - but it keeps picking the month after the month I set! For example the below is showing as 1st December, not November!
var datePickDate = new Date(2011, 11, 01);
$("#datepicker").datepicker({
defaultDate: datePickDate,
onSelect: function(dateText, inst){
$("#datepicker_value").val(dateText);
}
});
Your code is Ok, except the fact that in javascript months are 0-based. So you should put 10 for month if you want November. Check it here
<script>
$('#end_time').ready(function(){
$('#end_time').datepicker({
altFormat: "yy-mm-dd h:i:s",
changeYear: true,
changeMonth: true,
dateFormat: "yy-mm-dd h:i:s",
yearRange: "2011:2020"
});
});
</script>
=> output: 2011-06-30 h:i:s
I want output is: 2011-06-30 15:14:21
Who can help me ?
CMIIW, datepicker is only to pick date. time (hour,minute,second) is not included.
so the formatting for time is not there.
use this one that extend jquery ui datepicker. you can pick up both date and time.
http://trentrichardson.com/examples/timepicker/
a datepicker is for picking a DATE
there is no time component available via datepicker.
if you want to use the current time or any other time, you can write your own functions for parsing the date (without the time, so that datepicker still works) and for appending the time after picking a date
I have used JqueryUI plugin- date picker to display my date.
The format is such that it has Fromdate & Todate.
If I select fromDate: for example 09/28/2010 and
If I select toDate: for example 09/30/2010. It should be like this such that todate is
always the one which comes after the fromdate.
But i want to validate such that if I click toDate that is from previous month
or the day before fromDate the validation should not allow me to select a date which is
previous that of fromDate.
My Jscript is
<script type="text/javascript">
$(document).ready(function() {
$('.fromDate').datepicker({clickInput:true});
$('.toDate').datepicker({clickInput:true});
});
</script>
My html is
<tr><td>Enter FromDate:</td><td><input type="text" id="fromDate" class="fromDate"
readonly /></td></tr>
Enter ToDate:
How to do that. Any suggestions Please.
You can use a custom validation method for jQuery Validate for that. See this answer here on SO.