Menu
I am trying to do a simple page that takes a date (input type TEXT), and once the date is entered, another field will add 7 days to the input and display the date (+7 days) in a text input. My knowledge of jQuery is limited so I may have a small bug...
<html>
<head>
<title>Date Plus 7 Days</title>
<script type="text/javascript">
$(document).ready(function(){
function DateFromString(str){
str = str.split(/\D+/);
str = new Date(str[2],str[0]-1,(parseInt(str[1])+7));
return MMDDYYYY(str);
}
function MMDDYYYY(str) {
var ndateArr = str.toString().split(' ');
var Months = 'Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec';
return (parseInt(Months.indexOf(ndateArr[1])/4)+1)+'/'+ndateArr[2]+'/'+ndateArr[3];
}
function Add7Days() {
var date = $('#start_date').val();
var ndate = DateFromString(date);
return ndate;
}
$('#start_date').change(function(){
$('#end_date') = Add7Days();
})
});
</script>
</head>
<body>
Start Date
<input type="text" id="start_date" value=''>
<br>
End date
<input type="text" id="end_date" value=''>
</body>
</html>
What did I do wrong?
Thanks!
272
Use the value property on the input elements of type date , time and datetime-local to set their values, e.g. dateInput. value = '2026-06-24' . The value property can be used to get and set the value of an input type date , time and datetime-local .
A date-picker of jQuery UI is used to provide a calendar to the user to select the date from a Calendar. This date picker usually connected to a text-box so user selection of date from the calendar can be transferred to the textbox.
you've attempted to assign an object to $('#end_date'). jQuery deals with this in a different way by altering the value of the input box by leveraging .val('value-here')
Try this:
$('#start_date').change(function(){
$('#end_date').val(Add7Days());
});
See this fiddle: http://jsfiddle.net/zydZ2/
Also, Moment.JS is great for parsing and manipulating dates, I'd strongly recommend checking that out: http://momentjs.com/
Hope this helps!
183
functionally to add 7days to an existing date can be achieved by using
var today_date = new Date()
alert(today_date)
today_date.setDate(today_date.getDate() + 7)
alert(today_date)
this will add seven days to an existing date if its 31 than it will make it 7th of next month
hope this help
34
Your may using JQuery & JqueryUI datepicker featured to did it.
$('#start_date').datepicker({
dateFormat: 'mm/dd/yy',
minDate: 0,
});
$("#end_date").datepicker({
dateFormat: 'mm/dd/yy',
minDate: 7,
});
var _dt = new Date();
var _dt = _dt.setDate(_dt.getDate());
$("#start_date").datepicker("setDate","mm/dd/yy", _dt);
$("#end_date").datepicker("setDate", "mm/dd/yy", _dt);
you may refer this http://jsfiddle.net/o9grLdf0/12/
min = 0 for input startdate = today date and min = 7 mean today + 7 day for enddate
25
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With