I am trying to add end date with javascript.
<head>
<? $duration1 = $member_data['advt_duration']; //Using for var duration ?>
<script src="http://code.jquery.com/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(function() {
$('#start_date').datepicker({dateFormat: 'yy-mm-dd',timeFormat: "hh:mm tt"});
});
});
function getdate() {
var tt = document.getElementById('start_date').value;
var date = new Date(tt);
var newdate = new Date(date);
var duration = '<?php echo $duration1 ;?>';
//alert(duration);
if (duration ==="One Month") {
newdate.setDate(newdate.getDate() + 30);
}
if (duration ==="Three Months") {
newdate.setDate(newdate.getDate() + 90);
}
if (duration ==="Six Months") {
newdate.setDate(newdate.getDate() + 180);
}
if (duration ==="One Year") {
newdate.setDate(newdate.getDate() + 365);
}
var dd = newdate.getDate();
var mm = newdate.getMonth() + 1;
var y = newdate.getFullYear();
var someFormattedDate = y+ '-' + mm + '-' + dd;
document.getElementById('end_date').value = someFormattedDate;
}
</script>
</head>
<body>
From : <input name="start_date" type="text" id="start_date" style="border:1px solid #333;"/>
<input type="button" onclick="getdate()" value="Get End Date" style="background-color:#999; border:1px solid #333;"/>
To : <input name="end_date" type="text" id="end_date" style="border:1px solid #333;" readonly/>
</body>
Now I am Getting START DATE in YYYY-MM-DD Format...But END DATE is Not getting in that format...
e.g. If we set start date and suppose var duration = "One Year"...
start_date = "2016-05-09" //09 May 2016
Then
getting
end_date = "2017-5-9" Instead of "2017-05-09"
this will work
mm = ( mm < 10 ) ? ( "0" + ( mm ).toString() ) : ( mm ).toString();
dd= ( dd< 10 ) ? ( "0" + ( dd).toString() ) : ( dd ).toString();
Related
<?php
$date = trim(preg_replace('/ +/', ' ', preg_replace('/[^A-Za-z0-9- ]/', ' ', urldecode(html_entity_decode(strip_tags($_POST['date']))))));
$date2 = trim(preg_replace('/ +/', ' ', preg_replace('/[^A-Za-z0-9- ]/', ' ', urldecode(html_entity_decode(strip_tags($_POST['date2']))))));
?>
<!doctype html>
<html lang="en">
<head>
<title>date</title>
</head>
<body>
<form action="" method="post">
<label for="message" class="form-label">Date:</label>
<input type="date" class="form-control" id="date" name="date">
<br>
<label for="message" class="form-label">Date2:</label>
<input type="date" class="form-control" id="date2" name="date2">
<input id="saveForm" onclick="" class="button_text" type="submit" name="submit" value="Submit " />
</form>
<script>
var date = new Date();
var month = date.getMonth() + 1;
var day = date.getDate();
var year = date.getFullYear();
if (month < 10) month = "0" + month;
if (day < 10) day = "0" + day;
var today = month + "-" + day + "-" + year;
document.getElementById('date').value = today;
console.log(today);
//date works but output is diffrent
var date = new Date();
var month = date.getMonth() + 1;
var day = date.getDate();
var year = date.getFullYear();
if (month < 10) month = "0" + month;
if (day < 10) day = "0" + day;
var today = year + "-" + month + "-" + day;
document.getElementById('date2').value = today;
console.log(today);
</script>
</html>
So the bottom one works when loaded and displays correctly however when submitted or console logged looks like this 2023-01-13 and when I change it to the correct format it stops working but will then console log correctly but will still echo out wrong... What is going on here? how can I make the date auto populate when page is loaded and still console log and echo out correctly like month/day/year ?????
```
<!doctype html>
<html lang="en">
<head>
<title>date</title>
</head>
<body>
<form action="" method="post">
<label for="message" class="form-label">Date:</label>
<input type="date" class="form-control" id="date" name="date">
<br>
<label for="message" class="form-label">Date2:</label>
<input type="date" class="form-control" id="date2" name="date2">
<input id="saveForm" onclick="" class="button_text" type="submit" name="submit" value="Submit "/>
</form>
<script>
var date = new Date();
var month = date.getMonth() + 1;
var day = date.getDate();
var year = date.getFullYear();
if (month < 10) month = "0" + month;
if (day < 10) day = "0" + day;
var today = month + "-" + day + "-" + year;
document.getElementById('date').value = today;
console.log(today);
//date works but output is diffrent
var date = new Date();
var month = date.getMonth() + 1;
var day = date.getDate();
var year = date.getFullYear();
if (month < 10) month = "0" + month;
if (day < 10) day = "0" + day;
var today = year + "-" + month + "-" + day;
document.getElementById('date2').value = today;
console.log(today);
</script>
</html>
<?php
$date = trim(preg_replace('/ +/', ' ', preg_replace('/[^A-Za-z0-9- ]/', ' ', urldecode(html_entity_decode(strip_tags($_POST['date']))))));
$date2 = trim(preg_replace('/ +/', ' ', preg_replace('/[^A-Za-z0-9- ]/', ' ', urldecode(html_entity_decode(strip_tags($_POST['date2']))))));
echo '<hr><br>';
echo $date;
echo '<br>';
echo $date2;
?>
```
I assume when i change this it should output correctly but instead only makes it half work
var today = month + "-" + day + "-" + year;
when I select date and input month duration then other field will display the target date
how can I implement this,Please anybody help me to do that.my form is that
// I have tried to do that
$("#duration").keyup(function(){
var duration = $(this).val();
var open_date = $("#openDate").val();
// i want to use same function and method
// here will next code
var targetDate = new Date(open_date);
targetDate.setMonth(targetDate.getMonth() + duration);
var dd = targetDate.getDate();
var mm = targetDate.getMonth() + 1;
var yyyy = targetDate.getFullYear();
var dateString = dd + "/" + mm + "/" + yyyy;
$('#targetDate').val(dateString);
// i have do that but do not get my espect out put
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Open Date :
<input type="date" id="openDate"><br><br>
Duration Month:
<input type="text" id="duration" placeholder="mm"><br><br>
Target Date :
<input type="text" id="targetDate" placeholder="dd-mm-yyyy">
Please try this:
$("#duration").keyup(function(){
var duration = $(this).val();
var open_date = $("#openDate").val();
// i want to use same function and method
// here will next code
var targetDate = new Date(open_date);
targetDate.setMonth(targetDate.getMonth() + parseInt(duration));
var dd = targetDate.getDate();
var mm = targetDate.getMonth() + 1;
var yyyy = targetDate.getFullYear();
var dateString = dd + "/" + mm + "/" + yyyy;
$('#targetDate').val(dateString);
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Open Date :
<input type="date" id="openDate"><br><br>
Duration Month:
<input type="text" id="duration" placeholder="mm"><br><br>
Target Date :
<input type="text" id="targetDate" placeholder="dd-mm-yyyy">
This question already has answers here:
How to Add Two Days from Current Date to the Value of a Hidden Input
(3 answers)
How to insert Javascript variables into a database
(1 answer)
Closed 5 years ago.
I want to get the javascript value into my html input value and insert it into the database after the user click the submit
<script>
var currentDate = new Date();
if (currentDate.getDay() == 5) {
var numberOfDaysToAdd = 4; //Adding 4 to skip sat. & sun. if Friday
} else {
var numberOfDaysToAdd = 2; //Adding 2 days if not Friday
}
currentDate.setDate(currentDate.getDate() + numberOfDaysToAdd);
var dd = currentDate.getDate();
var mm = currentDate.getMonth() + 1;
var y = currentDate.getFullYear();
var someFormattedDate = y + '-' + mm + '-' + dd;
document.getElementById("display").innerHTML = someFormattedDate;
</script>
<?php
echo $_GET['someFormattedDate'];
?>
<input type="text" class="w8em format-y-m-d highlight-days-67 range-low-today" name="due_date" id="sd" maxlength="10" value="<?php echo " someFormattedDate " style="border: 3px double #CCCCCC; " disabled/>
Since your input id is sd,
document.getElementById("sd").value = someFormattedDate;
Note: Elements with Disabled attribute are not submitted, enable it before submit.
Full Code:
<?php
echo $_GET['due_date'];
?>
<form name="myform" id="myform" method="GET">
<input type="text" class="w8em format-y-m-d highlight-days-67 range-low-today" name="due_date" id="sd" maxlength="10" style="border: 3px double #CCCCCC; " readonly/>
<input type="submit" name="btn_submit" value="Submit">
</form>
<script>
var currentDate = new Date();
if (currentDate.getDay() == 5) {
var numberOfDaysToAdd = 4; //Adding 4 to skip sat. & sun. if Friday
} else {
var numberOfDaysToAdd = 2; //Adding 2 days if not Friday
}
currentDate.setDate(currentDate.getDate() + numberOfDaysToAdd);
var dd = currentDate.getDate();
var mm = currentDate.getMonth() + 1;
var y = currentDate.getFullYear();
var someFormattedDate = y + '-' + mm + '-' + dd;
document.getElementById("sd").value = someFormattedDate;
</script>
First, put the JavaScript code after the input you want to use. That way the input exists on the page when the code executes.
Second, use the actual id of the input.
Third, set the .value property.
Fourth, put the input in a form.
Fifth, don't disable the input.
Something like this:
<form>
<input type="text" class="w8em format-y-m-d highlight-days-67 range-low-today" name="due_date" id="sd" maxlength="10" style="border: 3px double #CCCCCC;" disabled/>
<input type="submit" value="Submit" />
</form>
<script>
// The rest of your JavaScript code, formatting your date value
document.getElementById("sd").value= someFormattedDate;
</script>
Unless otherwise specified, this <form> will submit a GET request to the current URL by default when the submit button is clicked.
Aside from that it's not really clear to me what you're trying to do with the PHP code here. Why you're trying to output a value that hasn't been submitted yet, or output a literal string, or whatever you're attempting.
<script>
var currentDate = new Date();
if (currentDate.getDay() == 5) {
var numberOfDaysToAdd = 4; //Adding 4 to skip sat. & sun. if Friday
} else {
var numberOfDaysToAdd = 2; //Adding 2 days if not Friday
}
currentDate.setDate(currentDate.getDate() + numberOfDaysToAdd);
var dd = currentDate.getDate();
var mm = currentDate.getMonth() + 1;
var y = currentDate.getFullYear();
var someFormattedDate = y + '-' + mm + '-' + dd;
document.getElementById("sd").innerHTML = someFormattedDate;
</script>
Description:- You are binding data with wrong element.
having this as intial code
<input type="date" class="closed_road_permit_expiry_date" min="2000-01-01" max="9999-01-31" name="closed_road_permit_expiry_date[]" value="value="2000-01-31" />
i tried doing this
<input type="date" class="closed_road_permit_expiry_date" min="2000-01-01" max="9999-01-31" name="closed_road_permit_expiry_date[]" id="currentDate" value=getCurrentDate()/>
function getCurrentDate() {
document.getElementById("currentDate").valueAsDate = new Date()
}
You cna run an IIFE to populate the field with the current data
(function getCurrentDate() {
return document.getElementById('currentDate').valueAsDate = new Date();
}())
<input type="date" class="closed_road_permit_expiry_date" min="2000-01-01" max="9999-01-31" name="closed_road_permit_expiry_date[]" id="currentDate" />
run getCurrentDate() function on window.onload not with value of the input
function getCurrentDate() {
document.getElementById("currentDate").valueAsDate = new Date()
}
window.onload = function() {
getCurrentDate()
}
<input type="date" class="closed_road_permit_expiry_date" min="2000-01-01" max="9999-01-31" name="closed_road_permit_expiry_date[]" id="currentDate" />
Try this:
function getCurrentDate() {
var date = new Date();
var day = date.getDate();
var month = date.getMonth() + 1;
var year = date.getFullYear();
var datestr = day + "/" + month + "/" + year;
document.getElementById("currentDate").value = datestr;
}
$(document).ready(function(){
getCurrentDate();
});
I am comparing some dropdownlist value, basically the Start date must be earlier than end date
I found a lot of sample source codes through goggle and others, but they only provide DD/MM/YYYY. I only need MM/YYY only, when ever i tried to remove "DD" there would be errors, if i am right its because of the date keyword/element.
Is there any solution to it? any help or ref link would be good. Thanks
P.s The codes below are working for DD/MM/YYYY
function y2k(number) {
return (number < 1000) ? number + 1900 : number;
}
function padout(number) {
return (number < 10) ? '0' + number : number;
}
function validate(what) {
var startday = what.startday.options[what.startday.selectedIndex].value;
var startmonth = what.startmonth.options[what.startmonth.selectedIndex].value;
var startyear = what.startyear.options[what.startyear.selectedIndex].text;
var endday = what.endday.options[what.endday.selectedIndex].value;
var endmonth = what.endmonth.options[what.endmonth.selectedIndex].value;
unvalidstartdate = startday + '/' + startmonth + '/' + startyear;
unvalidenddate = endday + '/' + endmonth;
var startdate = new Date(startyear - 0, startmonth - 1, startday - 0);
var enddate = new Date(endmonth - 1, endday - 0);
var validstartdate = padout(startdate.getDate()) + '/'
+ padout(startdate.getMonth() + 1) + '/'
+ y2k(startdate.getYear())
var validenddate = padout(enddate.getDate()) + '/'
+ padout(enddate.getMonth() + 1) + '/' + y2k(enddate.getYear());
if (unvalidstartdate != validstartdate) {
alert('Start Date: '
+ what.startday.options[what.startday.selectedIndex].text
+ ' '
+ what.startmonth.options[what.startmonth.selectedIndex].text
+ ' '
+ what.startyear.options[what.startyear.selectedIndex].text
+ ' is invalid');
return false;
}
if (unvalidenddate != validenddate) {
alert('End Date: '
+ what.endday.options[what.endday.selectedIndex].text + ' '
+ what.endmonth.options[what.endmonth.selectedIndex].text
+ ' '
+ ' is invalid');
return false;
}
starttime = Date.UTC(y2k(startdate.getYear()), startdate.getMonth(),
startdate.getDate(), 0, 0, 0);
endtime = Date.UTC(y2k(enddate.getYear()), enddate.getMonth(), enddate
.getDate(), 0, 0, 0);
if (starttime < endtime) {
alert('VALID');
// valid
} else {
alert('NOT VALID');
return false;
}
currentdate = new Date();
currenttime = Date.UTC(y2k(currentdate.getYear()), currentdate
.getMonth(), currentdate.getDate(), 0, 0, 0);
if (endtime < currenttime) {
// valid
} else {
alert('End Date is not less than todays date');
return false;
}
what.startdate.value = validstartdate;
what.enddate.value = validenddate;
return true;
}
//-->
</script>
<form>
Start Date: <select name="startday">
<option value="01">1st
<option value="02">2nd
<option value="03">3rd
</select> <select name="startmonth">
<option value="01">january
<option value="02">february
<option value="03">march
</select> <select name="startyear">
<option>1990
<option>1991
<option>1992
</select>
<p>
End Date: <select name="endday">
<option value="01">1st
<option value="02">2nd
<option value="03">3rd
</select> <select name="endmonth">
<option value="01">january
<option value="02">february
<option value="03">march
</select> <input type="hidden" name="startdate"> <input type="hidden"
name="enddate">
<p>
<input type="button" onClick="validate(this.form)" value="Validate">
</form>
var startDateFinal = "your startdate element value";
var endDateFinal = "your enddate element value";
var startDate = new Date (startDateFinal);
var endDate = new Date(endDateFinal);
if(endDate.getTime() > startDate.getTime()){
// some logic
}
else{
// some logic
}
var invalid=false;
var startDate="03/2011";//start date in mm/yyyy format
var endDate="04/2012";//end date in mm/yyyy format
var startMonth=startDate.substring(0,2);
var endMonth=endDate.substring(0,2);
var startYear=startDate.substring(3);
var endYear=endDate.substring(3);
if(startYear>endYear)
{
invalid=true;
}
else if(startYear<endYear && startMonth>endMonth)
invalid=true;
The Date constructor only needs year and month and you can use strings, so you can use the values directly from the form controls like:
var start = new Date(startyear, --startmonth);
var end = new Date(endyear, --endmonth);
if (start < end) {
// start is before end
}
Oh, and you should be using getFullYear to get the full year number. For compatibility with Java, the original getYear method only returns a two digit year.
The below code will give you two date fields the start date field will be smaller than end date field. the code works fine
you will get the jquery, jqueryui/calendar on http://jquery.com/ and http://jquery.com/ sites.
include below code in HEAD section
include jquery-1.5.1.min.js, jquery-ui-1.8.13.custom.min.js, jquery-ui-1.8.11.custom.css" ,calendar.css" files
$(function() {
var dates = $( "#txt_startdate, #txt_enddate" ).datepicker({
defaultDate: "+1w",
changeMonth: true,
changeYear: true,
numberOfMonths: 2,
dateFormat: 'yy-mm-dd',
onSelect: function( selectedDate ) {
var option = this.id == "txt_startdate" ? "minDate" : "maxDate",
instance = $( this ).data( "datepicker" ),
date = $.datepicker.parseDate(
instance.settings.dateFormat ||
$.datepicker._defaults.dateFormat,
selectedDate, instance.settings );
dates.not( this ).datepicker( "option", option, date );
}
});
});
enter below code in body section of your html
<input name="txt_startdate" id="txt_startdate" type="text" />
<input name="txt_enddate" id="txt_enddate" type="text" />
Hope this helps you
try this
function test()
{
var date1,date;
date1 = new Date(2011,11,1);
// startdate drop down values
//2011-->year 11--> startmonth 1-->startdate(this you keep always as 1 for startdate and end date) since you only wants to compare mm/yyyy
date2 = new Date(2002,11,1);
// enddate drop down values
//2011-->year 11--> endmonth 1-->enddate(this you keep always as 1 for startdate and end date) since you only wants to compare mm/yyyy
if(date1>date2)
alert("date1 is > date2")
else
alert("date2 is > date1")
}
check this date