✔ Hilfe mit JS Dropdown

A

avoelkl

Grünschnabel
Hi an alle,

ich habe folgenden Source erstellt und wollte mit der Funktion verdoppeln den Wert aus eine Dropdown auslesen und eine ander selektieren lassen.
Tag und Monat geht, aber das Jahr leider nicht...

Was ist da falsch?

HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <title>ControlPanel</title>
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" type="text/css" href="calendar.css">
<script type="text/javascript" src="yahoo-dom-event.js"></script>
<script type="text/javascript" src="calendar.js"></script>

<script type="text/javascript">
    function toggle(sId1,sId2,sId3,sId4,sId5,sId6)
    {
        obj1 = document.getElementById(sId1);
        obj2 = document.getElementById(sId2);
        obj3 = document.getElementById(sId3);
        obj4 = document.getElementById(sId4);
        obj5 = document.getElementById(sId5);
        obj6 = document.getElementById(sId6);
        obj1.readOnly = (true!=obj1.readOnly);
        obj2.readOnly = (true!=obj2.readOnly);
        obj3.readOnly = (true!=obj3.readOnly);
        obj4.readOnly = (true!=obj4.readOnly);
        obj5.readOnly = (true!=obj5.readOnly);
        obj6.readOnly = (true!=obj6.readOnly);
    }

	function verdoppeln(pId1,pId2,pId3)
	{
		obje1 = document.getElementById(pId1);
        obje2 = document.getElementById(pId2);
        obje3 = document.getElementById(pId3);

		h = document.dates.selDay.value;
		document.dates.EndDay.options[h].selected = true;
		i = document.dates.selMonth.value;
		document.dates.EndMonth.options[i].selected = true;
		j = document.dates.selYear.value;
		document.dates.EndYear.options[j].selected = true;
	}
window.setInterval("verdoppeln('EndDay','EndMonth','EndYear')", 3000);
</script>

<style type="text/css">
	#cal1Container { margin-right:10px; margin-bottom:10px }
</style>
</head>
<body class="yui-skin-sam">

<form name="dates">
<table width="600" bgcolor="#000000" border="0" cellpadding="5" cellspacing="1" align="left">
  <tr>
    <td bgcolor="#6699ff" align="center" colspan="3">
    <b>Termin anlegen</b>
    </td>
  </tr>
  <tr>
    <td width="170" bgcolor="#e7e7e7">Thema</td>
    <td width="250" bgcolor="#ffffff"><input type="text" name="thema" class="input" value="" size="25" maxlength="25"></td>
    <td width="180" bgcolor="#ffffff" rowspan="12" valign="top" align="center"><div id="cal1Container"></div></td>
  </tr>
  <tr>
    <td width="170" bgcolor="#e7e7e7">Datum - Beginn</td>
    <td width="250" bgcolor="#ffffff">
	<select name="selDay" class="inputnosize">
		<option value="0"> </option>
		<option value="1">1</option>
		<option value="2">2</option>
		<option value="3">3</option>
		<option value="4">4</option>
		<option value="5">5</option>
		<option value="6">6</option>
		<option value="7">7</option>
		<option value="8">8</option>
		<option value="9">9</option>
		<option value="10">10</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>
	</select>
	<select name="selMonth" class="inputnosize">
		<option value="0"> </option>
		<option value="1">1</option>
		<option value="2">2</option>
		<option value="3">3</option>
		<option value="4">4</option>
		<option value="5">5</option>
		<option value="6">6</option>
		<option value="7">7</option>
		<option value="8">8</option>
		<option value="9">9</option>
		<option value="10">10</option>
		<option value="11">11</option>
		<option value="12">12</option>
	</select>

	<select name="selYear" class="inputnosize">
		<option value="0"> </option>
		<option value="2007">2007</option>
		<option value="2008">2008</option>
		<option value="2009">2009</option>
	</select>
	</td>
  </tr>
  <tr>
    <td width="170" bgcolor="#e7e7e7">Uhrzeit - Beginn</td>
    <td width="250" bgcolor="#ffffff">
	<select name="selTimeHour" class="inputnosize">
		<option value="0">00</option>
		<option value="1">01</option>
		<option value="2">02</option>
		<option value="3">03</option>
		<option value="4">04</option>
		<option value="5">05</option>
		<option value="6">06</option>
		<option value="7">07</option>
		<option value="8">08</option>
		<option value="9">09</option>
		<option value="10">10</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>
	</select>
	:
	<select name="selTimeMinute" class="inputnosize">
		<option value="0">00</option>
		<option value="15">15</option>
		<option value="30">30</option>
		<option value="45">45</option>
	</select>
	</td>
  </tr>
  <tr>
    <td width="170" bgcolor="#e7e7e7">Datum - Ende</td>
    <td width="250" bgcolor="#ffffff">
	<select name="EndDay" id="EndDay" class="inputnosize">
		<option value="0"> </option>
		<option value="1">1</option>
		<option value="2">2</option>
		<option value="3">3</option>
		<option value="4">4</option>
		<option value="5">5</option>
		<option value="6">6</option>
		<option value="7">7</option>
		<option value="8">8</option>
		<option value="9">9</option>
		<option value="10">10</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>
	</select>
	<select name="EndMonth" id="EndMonth" class="inputnosize">
		<option value="0"> </option>
		<option value="1">1</option>
		<option value="2">2</option>
		<option value="3">3</option>
		<option value="4">4</option>
		<option value="5">5</option>
		<option value="6">6</option>
		<option value="7">7</option>
		<option value="8">8</option>
		<option value="9">9</option>
		<option value="10">10</option>
		<option value="11">11</option>
		<option value="12">12</option>
	</select>
	<select name="EndYear" id="EndYear" class="inputnosize">
		<option value="0"> </option>
		<option value="2007">2007</option>
		<option value="2008">2008</option>
		<option value="2009">2009</option>
	</select>
	</td>
  </tr>
  <tr>
    <td width="170" bgcolor="#e7e7e7">Uhrzeit - Ende</td>
    <td width="250" bgcolor="#ffffff">
	<select name="selTimeHourEnd" class="inputnosize">
		<option value="0">00</option>
		<option value="1">01</option>
		<option value="2">02</option>
		<option value="3">03</option>
		<option value="4">04</option>
		<option value="5">05</option>
		<option value="6">06</option>
		<option value="7">07</option>
		<option value="8">08</option>
		<option value="9">09</option>
		<option value="10">10</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>
	</select>
	:
	<select name="selTimeMinuteEnd" class="inputnosize">
		<option value="0">00</option>
		<option value="15">15</option>
		<option value="30">30</option>
		<option value="45">45</option>
	</select>
	</td>
  </tr>
  <tr>
    <td width="170" bgcolor="#e7e7e7">Ben&ouml;tigt</td>
    <td width="250" bgcolor="#ffffff">
	<input type="checkbox" name="ben1" value="1">Alexander Völkl<br>	</td>
  </tr>
  <tr>
    <td width="170" bgcolor="#e7e7e7">Kunde</td>
    <td width="250" bgcolor="#ffffff"><select name="kunde">
	<option value="9">92685 Floss - Alexander Völkl</option><option value="10">92685 Floss - Jessica Sommer</option><option value="11">92685 Floss - Albert Völkl</option><option value="12">92685 Floss - Anita Völkl</option><option value="13">92685 Floss - Jessica Völkl</option><option value="14">92685 Floss - Bruno Völkl</option>	</select>
	<input type="checkbox" onclick="toggle('input1','input2','input3','input4','input5','input6');" checked>
	</td>
  </tr>
  <tr>
    <td width="170" bgcolor="#e7e7e7">Name</td>
    <td width="430" bgcolor="#ffffff"><input type="text" name="name"readonly="readonly" id="input1" class="input" size="20" maxlength="20"></td>
  </tr>
  <tr>
    <td width="170" bgcolor="#e7e7e7">Strasse/Hausnummer</td>
    <td width="430" bgcolor="#ffffff"><input type="text" name="strasse" readonly="readonly" id="input2" class="input" size="25" maxlength="25">&nbsp;<input type="text" name="hausnummer" readonly="readonly" id="input3" class="inputhnrplz" size="4" maxlength="4"></td>
  </tr>
  <tr>
    <td width="170" bgcolor="#e7e7e7">PLZ/Ort</td>
    <td width="430" bgcolor="#ffffff"><input type="text" name="plz" readonly="readonly" id="input4" class="inputhnrplz" size="5" maxlength="5">&nbsp;<input type="text" name="ort" readonly="readonly" id="input5" class="input" size="25" maxlength="25"></td>
  </tr>
  <tr>
    <td width="170" bgcolor="#e7e7e7">Telefon</td>
    <td width="430" bgcolor="#ffffff"><input type="text" name="telefon" readonly="readonly" id="input6" class="input" size="15" maxlength="15"></td>
  </tr>
  <tr>
    <td width="170" bgcolor="#e7e7e7">Kommentar</td>
    <td width="250" bgcolor="#ffffff"><textarea name="anmerkung" class="textbox"></textarea></td>
  </tr>
  <tr>
    <td bgcolor="#6699ff" align="center" colspan="3">
    <input type="submit" name="submit" value="Termin speichern" class="button">
    </td>
  </tr>
</table>
</form>

<script type="text/javascript">
	YAHOO.namespace("example.calendar");

	YAHOO.example.calendar.init = function() {

		function handleSelect(type,args,obj) {
			var dates = args[0];
			var date = dates[0];
			var year = date[0], month = date[1], day = date[2];

			var selMonth = document.getElementById("selMonth");
			var selDay = document.getElementById("selDay");
			var selYear = document.getElementById("selYear");

			selMonth.selectedIndex = month;
			selDay.selectedIndex = day;

			for (var y=0;y<selYear.options.length;y++) {
				if (selYear.options[y].text == year) {
					selYear.selectedIndex = y;
					break;
				}
			}
		}

		function updateCal() {
			var selMonth = document.getElementById("selMonth");
			var selDay = document.getElementById("selDay");
			var selYear = document.getElementById("selYear");

			var month = parseInt(selMonth.options[selMonth.selectedIndex].text);
			var day = parseInt(selDay.options[selDay.selectedIndex].value);
			var year = parseInt(selYear.options[selYear.selectedIndex].value);

			if (! isNaN(month) && ! isNaN(day) && ! isNaN(year)) {
				var date = month + "/" + day + "/" + year;

				YAHOO.example.calendar.cal1.select(date);
				YAHOO.example.calendar.cal1.cfg.setProperty("pagedate", month + "/" + year);
				YAHOO.example.calendar.cal1.render();
			}
		}

		YAHOO.example.calendar.cal1 = new YAHOO.widget.Calendar("cal1","cal1Container",
																	{ mindate:"1/1/2006",
																	  maxdate:"12/31/2008" });
		YAHOO.example.calendar.cal1.selectEvent.subscribe(handleSelect, YAHOO.example.calendar.cal1, true);
		YAHOO.example.calendar.cal1.render();

		YAHOO.util.Event.addListener(["selMonth","selDay","selYear"], "change", updateCal);
	}

	YAHOO.util.Event.onDOMReady(YAHOO.example.calendar.init);
</script>
<div style="clear:both" ></div>

</body>
</html>
 
Hi,

den Wert, den du beim Jahr als Index übergibst, entspricht der Jahreszahl - also z.B. 2009. Dieser Index ist
natürlich unbekannt.

Versuche stattdessen, in h, i und j den jeweils gewählten Index (selectedIndex) zu schreiben und darüber
die entsprechenden Einträge auszuwählen.
Code: 
h = document.dates.selDay.selectedIndex;
document.dates.EndDay.options[h].selected = true;
i = document.dates.selMonth.selectedIndex;
document.dates.EndMonth.options[i].selected = true;
j = document.dates.selYear.selectedIndex;
document.dates.EndYear.options[j].selected = true;
Ciao
Quaese
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück