02-28-04, 04:56 PM
|
|
Newbie Coder
|
|
Join Date: Feb 2004
Posts: 12
Thanks: 0
Thanked 0 Times in 0 Posts
|
|
|
New to JavaScript
I've got a drop-down menu on a HTML form that has a list of events... and I need it to change 3 other feidls in the same form to match the event date (month, day, year) when you select the event. I can have PHP populate a js array, but I don't know how to get it to change. I think the onChange handler is used on the event dropdown but I don't know how to have it change the date fields.
Could someone post some examples for what I'm trying to do?
-ee99ee2
|
02-28-04, 05:11 PM
|
|
Newbie Coder
|
|
Join Date: Feb 2004
Posts: 18
Thanks: 0
Thanked 0 Times in 0 Posts
|
|
If you post the code you have so far it will allow people to help you a little faster.
|
02-28-04, 06:17 PM
|
|
Newbie Coder
|
|
Join Date: Feb 2004
Posts: 12
Thanks: 0
Thanked 0 Times in 0 Posts
|
|
Quote:
|
Originally Posted by jimcart
If you post the code you have so far it will allow people to help you a little faster.
|
Good idea... Here's a smaller version of the HTML form I have:
Now, when I in this example let's say "Event 1" is on 01/02/2004. When I select "Event 1" from the event list, I want the month, day and year to change to that event's corrosponding date. Same thing with any other event.
Not sure if that'll help any...
-ee99ee
|
02-28-04, 07:51 PM
|
|
Newbie Coder
|
|
Join Date: Feb 2004
Posts: 18
Thanks: 0
Thanked 0 Times in 0 Posts
|
|
Try This -- take the underscores out of the word javascript
not sure why it inserts them
<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT>
function splitdate(adate) {
adays = String(adate).substring(0,2);
amnth = String(adate).substring(3,5);
ayear = String(adate).substring(6,10);
elem = document.getElementById('day');
elem.value = adays;
elem = document.getElementById('month');
elem.value = amnth;
elem = document.getElementById('year');
elem.value = ayear;
}
</SCRIPT>
</HEAD>
<BODY>
<select name="event" onchange="javascript:splitdate(this.options[this.selectedIndex].value)">
<option value="20/05/2003">EVENT 1</option>
<option value="21/12/2004">EVENT 2</option>
</select>
<select id='month' name="month">
<option value="01" >01</option>
<option value="02" >02</option>
<option value="03" >03</option>
<option value="04" >04</option>
<option value="05" >05</option>
<option value="06" >06</option>
<option value="07" >07</option>
<option value="08" >08</option>
<option value="09" >09</option>
<option value="10" >10</option>
<option value="11" >11</option>
<option value="12" >12</option>
(and so on, though 12)
</select>
<select name="day">
<option value="01" >01</option>
<option value="02" >02</option>
<option value="03" >03</option>
<option value="04" >04</option>
<option value="05" >05</option>
<option value="06" >06</option>
<option value="07" >07</option>
<option value="08" >08</option>
<option value="09" >09</option>
<option value="00" >00</option>
<option value="11" >11</option>
<option value="12" >12</option>
<option value="13" >13</option>
<option value="14" >14</option>
<option value="15" >15</option>
<option value="16" >16</option>
<option value="17" >17</option>
<option value="18" >18</option>
<option value="19" >19</option>
<option value="20" >20</option>
<option value="21" >21</option>
<option value="22" >22</option>
<option value="23" >23</option>
<option value="24" >24</option>
<option value="25" >25</option>
<option value="26" >26</option>
<option value="27" >27</option>
<option value="28" >28</option>
<option value="29" >29</option>
<option value="30" >30</option>
<option value="31" >31</option>
(and so on, though 31)
</select>
<select name="year">
<option value="2003" >2003</option>
<option value="2004" >2004</option>
<option value="2005" >2005</option>
(and so on...)
</select>
</BODY>
</HTML>
|
02-28-04, 08:53 PM
|
|
Newbie Coder
|
|
Join Date: Feb 2004
Posts: 12
Thanks: 0
Thanked 0 Times in 0 Posts
|
|
Quote:
|
Originally Posted by jimcart
Try This -- take the underscores out of the word javascript
not sure why it inserts them
<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT>
function splitdate(adate) {
adays = String(adate).substring(0,2);
amnth = String(adate).substring(3,5);
ayear = String(adate).substring(6,10);
elem = document.getElementById('day');
elem.value = adays;
elem = document.getElementById('month');
elem.value = amnth;
elem = document.getElementById('year');
elem.value = ayear;
}
</SCRIPT>
</HEAD>
<BODY>
<select name="event" onchange="javascript:splitdate(this.options[this.selectedIndex].value)">
<option value="20/05/2003">EVENT 1</option>
<option value="21/12/2004">EVENT 2</option>
</select>
<select id='month' name="month">
<option value="01" >01</option>
<option value="02" >02</option>
<option value="03" >03</option>
<option value="04" >04</option>
<option value="05" >05</option>
<option value="06" >06</option>
<option value="07" >07</option>
<option value="08" >08</option>
<option value="09" >09</option>
<option value="10" >10</option>
<option value="11" >11</option>
<option value="12" >12</option>
(and so on, though 12)
</select>
<select name="day">
<option value="01" >01</option>
<option value="02" >02</option>
<option value="03" >03</option>
<option value="04" >04</option>
<option value="05" >05</option>
<option value="06" >06</option>
<option value="07" >07</option>
<option value="08" >08</option>
<option value="09" >09</option>
<option value="00" >00</option>
<option value="11" >11</option>
<option value="12" >12</option>
<option value="13" >13</option>
<option value="14" >14</option>
<option value="15" >15</option>
<option value="16" >16</option>
<option value="17" >17</option>
<option value="18" >18</option>
<option value="19" >19</option>
<option value="20" >20</option>
<option value="21" >21</option>
<option value="22" >22</option>
<option value="23" >23</option>
<option value="24" >24</option>
<option value="25" >25</option>
<option value="26" >26</option>
<option value="27" >27</option>
<option value="28" >28</option>
<option value="29" >29</option>
<option value="30" >30</option>
<option value="31" >31</option>
(and so on, though 31)
</select>
<select name="year">
<option value="2003" >2003</option>
<option value="2004" >2004</option>
<option value="2005" >2005</option>
(and so on...)
</select>
</BODY>
</HTML>
|
That's really close to what I need. Only problem is I cannot change the "value" of the event menu, because I use that somewhere else. Could I make something like:
I know that's not legal by the offical HTML standard, but IE won't care and I'm in a controled enviroment (not public).
-ee99ee
|
02-28-04, 10:24 PM
|
|
Newbie Coder
|
|
Join Date: Feb 2004
Posts: 18
Thanks: 0
Thanked 0 Times in 0 Posts
|
|
Hi,
You would probably be better off creating an array of "events" and "dates" and utilising the code I sent you except where it splits the date get the date value out of the array according to the selected event and split that.
Hope that all makes sense.
If you need me to create a sample let me know.
Regards,
Jim.
|
02-29-04, 03:23 AM
|
|
Newbie Coder
|
|
Join Date: Feb 2004
Posts: 12
Thanks: 0
Thanked 0 Times in 0 Posts
|
|
Quote:
|
Originally Posted by jimcart
Hi,
You would probably be better off creating an array of "events" and "dates" and utilising the code I sent you except where it splits the date get the date value out of the array according to the selected event and split that.
Hope that all makes sense.
If you need me to create a sample let me know.
Regards,
Jim.
|
Please give an example.
-ee99ee2
|
03-02-04, 01:54 AM
|
|
Newbie Coder
|
|
Join Date: Feb 2004
Posts: 18
Thanks: 0
Thanked 0 Times in 0 Posts
|
|
<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT>
function splitdate(aevent) {
var adate='';
for (i=0;i < xeventlist.length;i++) {
if (aevent == xeventlist[i][0]) {
adate = xeventlist[i][1];
adays = String(adate).substring(0,2);
amnth = String(adate).substring(3,5);
ayear = String(adate).substring(6,10);
elem = document.getElementById('day');
elem.value = adays;
elem = document.getElementById('month');
elem.value = amnth;
elem = document.getElementById('year');
elem.value = ayear;
}
}
}
var xeventlist=[""];
var xeventcounter=0;
function xaddevent(xevent){
xeventlist[xeventcounter]=(xevent);
xeventcounter++;
}
</SCRIPT>
</HEAD>
<BODY>
<SCRIPT>
xaddevent(["EVENT 1","21/01/2001"]);
xaddevent(["EVENT 2","22/02/2002"]);
xaddevent(["EVENT 3","23/03/2003"]);
xaddevent(["EVENT 4","24/04/2004"]);
xaddevent(["EVENT 5","25/05/2001"]);
xaddevent(["EVENT 6","26/06/2002"]);
xaddevent(["EVENT 7","27/07/2003"]);
xaddevent(["EVENT 8","28/08/2004"]);
</SCRIPT>
<select name="event" onchange="javascript:splitdate(this.options[this.selectedIndex].value)">
<option value="EVENT 1">EVENT 1</option>
<option value="EVENT 2">EVENT 2</option>
<option value="EVENT 3">EVENT 3</option>
<option value="EVENT 4">EVENT 4</option>
<option value="EVENT 5">EVENT 5</option>
<option value="EVENT 6">EVENT 6</option>
<option value="EVENT 7">EVENT 7</option>
<option value="EVENT 8">EVENT 8</option>
</select>
<select id='month' name="month">
<option value="01" >01</option>
<option value="02" >02</option>
<option value="03" >03</option>
<option value="04" >04</option>
<option value="05" >05</option>
<option value="06" >06</option>
<option value="07" >07</option>
<option value="08" >08</option>
<option value="09" >09</option>
<option value="10" >10</option>
<option value="11" >11</option>
<option value="12" >12</option>
(and so on, though 12)
</select>
<select name="day">
<option value="01" >01</option>
<option value="02" >02</option>
<option value="03" >03</option>
<option value="04" >04</option>
<option value="05" >05</option>
<option value="06" >06</option>
<option value="07" >07</option>
<option value="08" >08</option>
<option value="09" >09</option>
<option value="00" >00</option>
<option value="11" >11</option>
<option value="12" >12</option>
<option value="13" >13</option>
<option value="14" >14</option>
<option value="15" >15</option>
<option value="16" >16</option>
<option value="17" >17</option>
<option value="18" >18</option>
<option value="19" >19</option>
<option value="20" >20</option>
<option value="21" >21</option>
<option value="22" >22</option>
<option value="23" >23</option>
<option value="24" >24</option>
<option value="25" >25</option>
<option value="26" >26</option>
<option value="27" >27</option>
<option value="28" >28</option>
<option value="29" >29</option>
<option value="30" >30</option>
<option value="31" >31</option>
(and so on, though 31)
</select>
<select name="year">
<option value="2000" >2000</option>
<option value="2001" >2001</option>
<option value="2002" >2002</option>
<option value="2003" >2003</option>
<option value="2004" >2004</option>
<option value="2005" >2005</option>
(and so on...)
</select>
</BODY>
</HTML>
|
03-03-04, 08:05 AM
|
|
Newbie Coder
|
|
Join Date: Feb 2004
Posts: 12
Thanks: 0
Thanked 0 Times in 0 Posts
|
|
Awesome man, thanks. I'll give that a try. 
-ee99ee2
|
|
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
|
|
|
| Thread Tools |
|
|
| Display Modes |
 Linear Mode
|
Posting Rules
|
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
HTML code is Off
|
|
|
|
