Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

Javascript: Update textfield with button

Posted on 2010-08-30
11
Medium Priority
?
234 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 6
  • 5
11 Comments
 
LVL 60

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 60

Assisted Solution

by:HainKurt
HainKurt earned 2000 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
Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

 
LVL 60

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 60

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 60

Accepted Solution

by:
HainKurt earned 2000 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

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Question has a verified solution.

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

Introduction This tutorial will give you a fast look what you can do with WhizBase. I expect you already know how to work with HTML at least, and that you understand the basics of the internet and how the internet works. WhizBase is a server-s…
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 lists in Python. Lists, as their name suggests, are a means for ordering and storing values. : Lists are declared using brackets; for example: t = [1, 2, 3]: Lists may contain a mix of data types; for example: t = ['string', 1, T…
The viewer will learn how to dynamically set the form action using jQuery.
Suggested Courses

636 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