PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : problem mit anmeldeformular



ccc
06-04-2004, 01:23
hi

ich sollte eine webseite mit anmeldeformular bauen und die angaben via cgi script per mail schicken.

cgi script selber sollte kein problem sein.

mein problem ist: es gibt ca. 10 länder
und jedes land hat ca. 30 filialen.

wie kann ich mit JavaScript realisieren, wenn der kunde ein land auswählt,
automatisch auch eine auswahl der verschiedenen filialen von diesem land zur auswahl bekommt
und ich nur mit einem einzigen cgi script auswerten und schicken kann ?

sixfriends
06-04-2004, 04:09
Entweder muss sich das Script beim Auswählen eines Landes mit diesem Land als Parameter selbst aufrufen oder
du greifst über Javascript auf die css visibility Attribute der einzelnen Listen zu und blendest Sie nur bei Bedarf ein. Über den bei Länder gewählten Eintrag kann ja dann die richtige Filiale gefunden werden.

Ich würde die erste Möglichkeit bevorzugen.

sixfriends

Jana
06-04-2004, 08:34
Wie wäre es mit:


<html>
<head>
<title>Download js_scripts http://www.cross-browser.com</title>

<style type="text/css"><!--

a.m:link, a.m:visited, a.m:active { font-family: verdana,arial,sans-serif; text-decoration:none; font-size: 12px; color:#000000; background:transparent; }
a.m:hover { font-family: verdana,arial,sans-serif; text-decoration:none; font-size: 12px; color:#ffffff; background:#008000; }
a.ml:link, a.ml:visited, a.ml:active, a.ml:hover { font-family: verdana,arial,sans-serif; text-decoration:none; font-size: 12px; color:#000000; background:transparent; }

.menuBox { position:absolute; visibility:hidden; overflow:hidden; font-family: verdana,arial,sans-serif; font-size: 12px; color:#66ff66; background: #ccffcc; layer-background-color: #ccffcc; width:160px; padding:2px; line-height:1.3em; border:2px outset; }
#menuAnchor { position:relative; visibility:hidden; width:1em; height:1em; left:0px; top:0px; }

.menuLabel { position:absolute; visibility:hidden; overflow:hidden; font-family: verdana,arial,sans-serif; font-size: 12px; font-weight:bold; color:#008000; background: #339933; layer-background-color: #339933; width:75px; height:20px; clip:rect(0px,75px,20px,0px); margin:0px; padding:2px; border:1px outset;}
--></style>

<script type='text/javascript' src='cbe/cbe_core.js'></script>
<script type='text/javascript' src='cbe/cbe_event.js'></script>


<script type="text/javascript"><!--
var menuCount=3, menuAnchor, menuArray, activeMenu=1, menuOpen=false, activeColor='#ccffcc', inactiveColor='#339933';
function windowOnload()
{
menuAnchor = cbeGetElementById('menuAnchor').cbe;
menuArray = new Array();
window.cbe.addEventListener("resize", resizeListener);
document.cbe.addEventListener("click", menuHide);
setTimeout("init()", 250);
}

function resizeListener(e) {
init();
}

function init() {
var i, menuX, menuY, menuLabel;
menuX=menuAnchor.pageX();
menuY=menuAnchor.pageY();
for (i = 1; i <= menuCount; ++i) {
menuLabel = cbeGetElementById('menuLabel'+i).cbe;
menuLabel.zIndex(1);
menuLabel.resizeTo(75,20);
menuLabel.moveTo(menuX, menuY);
menuLabel.show();
menuArray[i] = cbeGetElementById('menu'+i).cbe;
menuArray[i].moveTo(menuX, menuY + menuLabel.height());
menuArray[i].menuLabel = menuLabel;
menuArray[i].zIndex(2);
menuX += menuLabel.width();
}
}

function menuShow(mn)
{
if (mn == activeMenu && menuOpen) {
closeMenu();
return;
}
menuArray[activeMenu].hide()
for (i = 1; i <= menuCount; ++i) {
menuArray[i].menuLabel.background(inactiveColor);
}
menuArray[mn].show();
menuArray[mn].menuLabel.background(activeColor);
activeMenu = mn;
menuOpen = true;
}

function menuHide(e)
{
if (!menuOpen) return;
var x = e.pageX;
var y = e.pageY;
if (!menuArray[activeMenu].contains(x,y,-2,0,0,0)
&& !menuArray[activeMenu].menuLabel.contains(x,y,0,20,0,0)) {
closeMenu();
}
}

function closeMenu() {
menuArray[activeMenu].hide();
menuArray[activeMenu].menuLabel.background(inactiveColor);
menuOpen = false;
}

//--></script>
</head>

<body marginwidth='0' marginheight='0'>


<div id='menuAnchor'>&nbsp;</div>

<form action="select.htm">


<div id='menuLabel1' class='menuLabel'><a class='ml' href="javascript:menuShow(1)">Label1</a></div>
<div id='menu1' class='menuBox'>
<select name="Pizza1" size="15"
onchange="alert(this.form.Pizza1.options[this.form.Pizza1.selectedIndex].value)">
<option value="P01">Pizza Napoli 1</option>
<option value="P02">Pizza Funghi 1</option>
<option value="P03">Pizza Mare</option>
<option value="P04">Pizza Tonno</option>
<option value="P05">Pizza Mexicana</option>
<option value="P06">Pizza Regina</option>
<option value="P07">Pizza de la Casa</option>
<option value="P08">Pizza Calzone</option>
<option value="P09">Pizza con tutti</option>
</select>
</div>

<div id='menuLabel2' class='menuLabel'><a class='ml' href="javascript:menuShow(2)">Label2</a></div>
<div id='menu2' class='menuBox'>
<select name="Pizza2" size="15"
onchange="alert(this.form.Pizza2.options[this.form.Pizza2.selectedIndex].value)">
<option value="P101">Pizza Napoli 2</option>
<option value="P102">Pizza Funghi 2</option>
<option value="P103">Pizza Mare</option>
<option value="P104">Pizza Tonno</option>
<option value="P105">Pizza Mexicana</option>
<option value="P106">Pizza Regina</option>
<option value="P107">Pizza de la Casa</option>
<option value="P108">Pizza Calzone</option>
<option value="P109">Pizza con tutti</option>
</select>
</div>

<div id='menuLabel3' class='menuLabel'><a class='ml' href="javascript:menuShow(3)">Label3</a></div>
<div id='menu3' class='menuBox'>
<select name="Pizza3" size="15"
onchange="alert(this.form.Pizza3.options[this.form.Pizza3.selectedIndex].value)">
<option value="P1101">Pizza Napoli 3</option>
<option value="P1102">Pizza Funghi 3</option>
<option value="P1103">Pizza Mare 3</option>
<option value="P1104">Pizza Tonno</option>
<option value="P1105">Pizza Mexicana</option>
<option value="P1106">Pizza Regina</option>
<option value="P1107">Pizza de la Casa</option>
<option value="P1108">Pizza Calzone</option>
<option value="P1109">Pizza con tutti</option>
</select>
</div>

</form>

</body>
</html>

ccc
06-04-2004, 21:56
hi Jana

herzlichen dank !

aber wenn ich diesen code ausprobiere,
bekomme ich einfach eine leere webseite.

gruss
ccc

Jana
07-04-2004, 08:39
Du brauchst die js-Dateien von http://Cross-bowser.com
Dann mußt du den Pfad für die js-Dateien richtig setzen.

Die leere Seite hast du, weil die Visibility auf hidden gestellt ist.