We help IT Professionals succeed at work.

textlink that will insert date into a textbox

plusone3055
plusone3055 asked
on
262 Views
Last Modified: 2012-05-29
hello
 
I need a textlink ("Yesterday") that by clcicking it will insert the current date (- 1 day) into a textbox
on the current page

so  kind of like clicking a date on a calendar and it inserting a date into a textbox but instead just clicking a textlink athat only inserts yesterdays date
Comment
Watch Question

Kyle HamiltonData Scientist
Most Valuable Expert 2014

Commented:
here's a jquery one.

You can format the date different ways. look up the date unction

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

<script>
    $(function(){
        
        var yesturday =new Date();
        yesturday.setDate(yesturday.getDate()-1);

        $("#link").click(function(e){
            e.preventDefault();
            $("#date").text(yesturday);
        });
    });
    
</script>

<a href="#" id="link">Get yesturday's date</a><br/>
    <div id="date"></div>

Open in new window

Author

Commented:
I cannot use  JQuery in this page
just regular Javascript please

I already have a textbox in my form that a calendar links to but the calendar only starts wit  the current date for reasons they set..It was requested that we have another link next to the calendar that puts  only yeterdays date into the textbox
Kyle HamiltonData Scientist
Most Valuable Expert 2014

Commented:
<script>
var yesterday =new Date();
yesterday.setDate(yesterday.getDate()-1);

var link = document.getElementById("link");

function setYesterday() {
    var date = document.getElementById("date");
    date.innerHTML = yesterday;
 };

</script>

<a href="#" id="link" onclick="setYesterday();">Get yesterday't date</a><br/>
<div id="date"></div>
Kyle HamiltonData Scientist
Most Valuable Expert 2014

Commented:
If the textbox is a textarea or input field you may need to use:

var formObject = document.forms['myform_id'];
formObject.elements["element_name"].value = yesterday;

Author

Commented:
yes
the form is named       form1        
The textboxname is named datefilter

can you put that into the codeyou had above..

im sorry the var date and var link confused me
Kyle HamiltonData Scientist
Most Valuable Expert 2014

Commented:
var yesterday =new Date();
yesterday.setDate(yesterday.getDate()-1);

function setYesterday() {
    var formObject = document.forms["form1"];
    formObject.elements["datefilter"].value = yesterday;
 };

Open in new window


sorry for all the edits, bloody typos....

Author

Commented:
okay and now for the link with that codeand if possible just the dd/mm/yy format I don't need the day :)
Kyle HamiltonData Scientist
Most Valuable Expert 2014

Commented:
<script>
var yesterday = new Date();
yesterday.setDate(yesterday.getDate()-1);

var dayofWeek = yesterday.getDay(); // day o fthe week
var month = yesterday.getMonth() + 1; // the month 0-11
var dayofmonth = yesterday.getDate(); // day of the month
var year = yesterday.getFullYear(); // the year

var y = month +"/"+ dayofmonth +"/"+ year;

function setyesterday() {
    var formObject = document.forms["form1"];
    formObject.elements["datefilter"].value = y;
};
</script>

<a href="#" onclick="setyesterday();">Get yesterday't date</a>

<form name="form1">
    <textarea name="datefilter"></textarea>
</form>

Open in new window

Author

Commented:
okay heres where its getting ugly
I had taken the code you gave me the last time before the recent post
and did this...

<script>
function setYesterday(dateString) {
    var yesterday =new Date();
yesterday.setDate(yesterday.getDate()-1);
      
      var formObject = document.forms["Form1"];
    formObject.elements["datefilter"].value = yesterday;
 };
            </script>

<a href="##" id="datefilter" onclick="setYesterday();">Pastdue</a><br/>

now its doing what I was hoping it would do and put yesterdays date into the textbox...

28-May-2012

BUT
when I click the button to run the query its saying

Conversion failed when converting datetime from character string
im using ColdFusion by the way.. anyway to force it to date format ???
Kyle HamiltonData Scientist
Most Valuable Expert 2014

Commented:
Yes, it gets inserted as a string. I'm not that familiar with coldfusion. But if you are inserting the date into a database, then you can format it for that particular database if you want.

OR,  if the link is clicked, get the date -1 with your coldfusion application - then it's an actual date. And only use the textarea for display purposes.

Does that make sense?

Author

Commented:
what is the quickest way to make it (dateformat dd-mmm-yyyy) hwen being passed in with Javascript
Ive been trying mayn different ways and its not working
Kyle HamiltonData Scientist
Most Valuable Expert 2014

Commented:
I just did a little cursory "research". If you use the latest code I gave you, I think the format  (mm/dd/yyyy) will satisfy coldfusion. Give it a shot.

Author

Commented:
could you please put it in the code..
im sorry i don't know where it would go ?
Kyle HamiltonData Scientist
Most Valuable Expert 2014

Commented:
Use the latest code I posted. change this line:

var y = month +"/"+ dayofmonth +"/"+ year;

to:

var y = month +"-"+ dayofmonth +"-"+ year;

You can remove dateString from your function parameters. You won't need it anymore. No need to run extra functions.
Kyle HamiltonData Scientist
Most Valuable Expert 2014

Commented:
here's the whole script again:

<script>



var yesterday = new Date();
yesterday.setDate(yesterday.getDate()-1);

var dayofWeek = yesterday.getDay(); // day o fthe week
var month = yesterday.getMonth() + 1; // the month 0-11
var dayofmonth = yesterday.getDate(); // day of the month
var year = yesterday.getFullYear(); // the year

var y = month +"-"+ dayofmonth +"-"+ year;

function setyesterday() {
    var formObject = document.forms["form1"];
    formObject.elements["datefilter"].value = y;
};

 
</script>

Open in new window

Author

Commented:
this code does not put anyhting in the box
i got a JS error saying it was expecting a ; somewhere


<script>
var yesterday = new Date();
yesterday.setDate(yesterday.getDate()-1);

var dayofWeek = yesterday.getDay(); // day o fthe week
var month = yesterday.getMonth() + 1; // the month 0-11
var dayofmonth = yesterday.getDate(); // day of the month
var year = yesterday.getFullYear(); // the year

var y = month +"/"+ dayofmonth +"/"+ year;

function setyesterday() {
    var formObject = document.forms["form1"];
    formObject.elements["datefilter"].value = y;
};
</script>

<a href="##" id="datefilter" onclick="setyesterday();">test</a><br/>

Author

Commented:
WAIT WAIT
The script you gave me works except i need the format to be dd-mmm-yyyy

 can it be that way with your code ????
Kyle HamiltonData Scientist
Most Valuable Expert 2014

Commented:
It works for me. There must have a typo somewhere.

Here's the entire file:

<!DOCTYPE html>
<html>
<head>
<title>Yesterday</title>
<script>



var yesterday = new Date();
yesterday.setDate(yesterday.getDate()-1);

var dayofWeek = yesterday.getDay(); // day o fthe week
var month = yesterday.getMonth() + 1; // the month 0-11
var dayofmonth = yesterday.getDate(); // day of the month
var year = yesterday.getFullYear(); // the year

var y = month +"-"+ dayofmonth +"-"+ year;

function setyesterday() {
    var formObject = document.forms["form1"];
    formObject.elements["datefilter"].value = y;
};

 
</script>


</head>
<body>

    <form name="form1">
    <a href="#" onclick="setyesterday();">Get yesterday't date</a><br/>
    <textarea name="datefilter"></textarea>
    </form>
</body>
</html>

Open in new window


One thing that I did that might be an issue, is at some point I changed the function name from setYesterday to setyesterday...

Author

Commented:
no no i got it to now throw the error but it said i entered an invalid date cause its set to
mm-ddd-yyyy

heres the code that worked up to that point

<script>



var yesterday = new Date();
yesterday.setDate(yesterday.getDate()-1);

var dayofWeek = yesterday.getDay(); // day o fthe week
var month = yesterday.getMonth() + 1; // the month 0-11
var dayofmonth = yesterday.getDate(); // day of the month
var year = yesterday.getFullYear(); // the year

var y = month +"-"+ dayofmonth +"-"+ year;

function setyesterday() {
    var formObject = document.forms["form1"];
    formObject.elements["datefilter"].value = y;
};

 
</script>

i just need it changed so the date format is dd-mmm-yyyy
is that possible
I thank you for all this help I can go home after this its 3 hours past quitting time
Kyle HamiltonData Scientist
Most Valuable Expert 2014

Commented:
oh wait yerself :)

need to change this:

var y = month +"-"+ dayofmonth +"-"+ year; // 5-28-2012

to this:

var y = dayofmonth +"-"+ month +"-"+ year; // 28-5-2012

do you need the whole script again?

Author

Commented:
im so sorry here is the real correct format i hadn't finished typing before you submitted

Alert! You have submitted an invalid date !
Please note that all dates must be input using the "d-mmm-yy" format! You submitted the value "5-28-2012".
The month value must be any one of the following: Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec.
Kyle HamiltonData Scientist
Most Valuable Expert 2014

Commented:
just to clarify:

28-May-12

or can it be:

28-May-2012

Author

Commented:
28-May-2012
Data Scientist
Most Valuable Expert 2014
Commented:
This one is on us!
(Get your first solution completely free - no credit card required)
UNLOCK SOLUTION

Author

Commented:
thank you for all the time :)
Unlock the solution to this question.
Join our community and discover your potential

Experts Exchange is the only place where you can interact directly with leading experts in the technology field. Become a member today and access the collective knowledge of thousands of technology experts.

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.