Solved

Javascript: Update textfield with button

Posted on 2010-08-30
11
227 Views
Last Modified: 2012-10-11
Good morning.  Using PHP and Javascript I am looking to update two text fields with a single button click.

The text fields are a Start and End date
The button is hardcoded for YearToDate information.

Here is my PHP for the button
echo "<input type='button' onclick='selectytd()' value='Select YTD' />";

Here is my Javascript for the function:
function selectytd()
{
var xmlHttp = ajax();
      
      xmlHttp.onreadystatechange=function()
    {
            if(xmlHttp.readyState==4)
            {
                  document.getElementById("graph").innerHTML = xmlHttp.responseText;
            }
    };
      xmlHttp.open("GET","graphcomp.php?&start=01/01/2010&end=&"+currentdatejf(),true);
      document.getElementById("graph").innerHTML = "Loading...";
      xmlHttp.send(null);      

}

function currentdatejf()
{
      var currentTime = new Date();
var month = currentTime.getMonth() + 1;
var day = currentTime.getDate();
var year = currentTime.getFullYear();
return month + "/" + day + "/" + year;

}

Could anyone assist with this?

0
Comment
Question by:nm67304
  • 6
  • 5
11 Comments
 
LVL 51

Expert Comment

by:HainKurt
ID: 33557930
I could not get what you mean but in this function you can change the values

function selectytd() {
  document.getElementById("txt1").value="Hain";
  document.getElementById("txt2").value="Kurt";
...
0
 
LVL 51

Assisted Solution

by:HainKurt
HainKurt earned 500 total points
ID: 33557961
I think you want this
<input type='button' onclick='selectytd()' value='Select YTD' />

<script>
function selectytd() {
  var xmlHttp = ajax();
  xmlHttp.onreadystatechange=function() {
    if(xmlHttp.readyState==4) {
      document.getElementById("graph").innerHTML = xmlHttp.responseText;
    }
  };
  xmlHttp.open("GET","graphcomp.php?&start=" + currentdateStart() +"&end=&" + currentdateEnd(),true);
  document.getElementById("graph").innerHTML = "Loading...";
  xmlHttp.send(null);      
}

function currentdateEnd() {
  var currentTime = new Date();
  var month = currentTime.getMonth() + 1;
  var day = currentTime.getDate();
  var year = currentTime.getFullYear();
  return month + "/" + day + "/" + year;
}

function currentdateStart() {
  var currentTime = new Date();
  var month = 1;
  var day = 1;
  var year = currentTime.getFullYear();
  return month + "/" + day + "/" + year;
}
alert(currentdateStart());
</script>

Open in new window

0
 

Author Comment

by:nm67304
ID: 33558153
This looks like it would help
But now I am getting an Error on Page.

0
DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

 
LVL 51

Expert Comment

by:HainKurt
ID: 33558229
what error? on which line?
I did not add anything to cause any error ;)
0
 

Author Comment

by:nm67304
ID: 33558311
Ok I think if fixed the error but it still doesnt update the two text fields, start and end
0
 
LVL 51

Expert Comment

by:HainKurt
ID: 33558437
"still doesnt update the two text fields, start and end"

I dont see any code for those two text and I dont see how your code will udate those... do you miss any code?
0
 

Author Comment

by:nm67304
ID: 33558556
To help you, there are two fields i want the button to update...A Start field and End field, both text fields.
When you click SelectYTD I want it to populate those two text fields with the Start date as 01/01/2010 and the end field with whatever the current date is.

The reason for doing this is because this selectytd button will refresh a portion of the page with information...the date range for that information would pull from whatever is displayed in those two text boxes.

<table><tbody><tr><td>Start</td><td><input type='text' id='start' value='<?php echo date("m/d/Y");?>'/></td><td><a href="javascript:cal1.init('start',360,300);" id="cal1">MM/DD/YYYY</a></td></tr><tr><td>End</td><td><input type='text' id='end' value='<?php echo date("m/d/Y");?>'/></td><td><a href="javascript:cal1.init('end',360,300);" id="cal1">MM/DD/YYYY</a></td></tr></tbody></table><br/><input type='button' onclick='refresh()' value='Refresh' />
0
 

Author Comment

by:nm67304
ID: 33558598
Here is the snippit
<table><tbody><tr><td>Start</td><td><input type='text' id='start' value='<?php echo date("m/d/Y");?>'/></td><td><a href="javascript:cal1.init('start',360,300);" id="cal1">MM/DD/YYYY</a></td></tr><tr><td>End</td><td><input type='text' id='end' value='<?php echo date("m/d/Y");?>'/></td><td><a href="javascript:cal1.init('end',360,300);" id="cal1">MM/DD/YYYY</a></td></tr></tbody></table><br/><input type='button' onclick='refresh()' value='Refresh' />

Open in new window

0
 

Author Comment

by:nm67304
ID: 33559108
Any udpate?
0
 
LVL 51

Accepted Solution

by:
HainKurt earned 500 total points
ID: 33560608
us this function instead in the solution provided @ 33557961
function selectytd() {
  var dtStart = currentdateStart();
  var dtEnd = currentdateEnd();
  document.getElementById("start").value=dtStart;
  document.getElementById("end").value=dtEnd;
  var xmlHttp = ajax();
  xmlHttp.onreadystatechange=function() {
    if(xmlHttp.readyState==4) {
      document.getElementById("graph").innerHTML = xmlHttp.responseText;
    }
  };
  xmlHttp.open("GET","graphcomp.php?&start=" + dtStart +"&end=&" + dtEnd,true);
  document.getElementById("graph").innerHTML = "Loading...";
  xmlHttp.send(null);      
}

Open in new window

0
 

Author Comment

by:nm67304
ID: 33561078
That works, thanks.

It answered my posted question.
I posted it because i THOUGHT this would fix my main issue, but it didnt lol.  Back to the drawing board.

Thanks though, this cleans it up
0

Featured Post

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

The following is a collection of cases for strange behaviour when using advanced techniques in DOS batch files. You should have some basic experience in batch "programming", as I'm assuming some knowledge and not further explain the basics. For some…
It is a general practice to get rid of old user profiles on a computer  in a LAN environment. As I have been working with a company in a LAN environment where users move from one place to some other place at times. This will make many user profil…
Learn the basics of modules and packages in Python. Every Python file is a module, ending in the suffix: .py: Modules are a collection of functions and variables.: Packages are a collection of modules.: Module functions and variables are accessed us…
In this fifth video of the Xpdf series, we discuss and demonstrate the PDFdetach utility, which is able to list and, more importantly, extract attachments that are embedded in PDF files. It does this via a command line interface, making it suitable …

821 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question