• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

benötige hilfe bei der select box...

3l3ctric

Neues Mitglied
Hey,

ich bräuchte hilfe, was für jmd. der sich gut mit HTML auskennt, sicher kein Problem sein dürfte...
zum besseren verständnis habe ich das hier schonmal geschrieben:
HTML:
<HTML>
<HEAD>
 <TITLE>New Document</TITLE>
</HEAD>
<BODY>  <form name="form" action="">
    <select name="select">
    <option value=""></option>
<option value="">Baden-Württemberg</option>
       <option value="">Berlin</option>
       <option value="">Brandenburg</option>
       <option value="">Bremen</option>

       <option value="">Hamburg</option>
       <option value="">Hessen</option>
       <option value="">Mecklenburg-Vorpommern</option>
       <option value="">Niedersachsen</option>
       <option value="">Nordrhein-Westfalen</option>
       <option value="">Rheinland-Pfalz</option>

       <option value="">Saarland</option>
       <option value="">Sachsen</option>
       <option value="">Sachsen-Anhalt</option>
       <option value="">Schleswig-Holstein</option>
       <option value="">Thüringen</option>
       </select>
           <select name="select" disabled="disabled">
<option value="" >Stadt bla bla bla</option>
       <option value="">Stadt bla bla bla</option>
       <option value="">Stadt bla bla bla</option>
       <option value="">Stadt bla bla bla</option>
       <option value="">Stadt bla bla bla</option>
       </select>
       <input type='submit' value='Abschicken'>
</BODY>
</HTML>

soo... jetzt soll, wenn man z.B. Baden-Würtenberg ausgewählt hat, Städte auswählen können, die in BW liegen... und wenn man NRW auswählt, Städte die in NRW liegen... die 2. Select box soll sollange disable bleiben, bis man ein Bundesland ausgewählt hat..

ich hoffe jmd. könnte mir helfen :-?

mfg
 
Ohne das Formular abzuschicken, wäre das nur über JavaScript lösbar.

Wenn Du das Formular abschicken willst um die 2. Select-Box zu aktivieren, müsstest Du eine Webprogrammiersprache wie php verwenden.

Dein Formular hat zudem keinen </form>-Tag am Ende, nur als Hinweis.
 
Dein Formular hat zudem keinen </form>-Tag am Ende, nur als Hinweis.
Dieser Script diente jedlich als visuelle Darstellung... :P

Wenn Du das Formular abschicken willst um die 2. Select-Box zu aktivieren, müsstest Du eine Webprogrammiersprache wie php verwenden.
Ich habe dies schon ein paar mal gesehen... man hat in der ersten Box etwas ausgewählt und dann wurde die 2. "Freigeschaltet" und konnte dort dann wieder etwas auswählen...

Es sollte wie folgt sein: (ES IST NUR EIN BEISPIEL!!!)

Man möchte gerade eine Pizza bestellen... dann soll man angeben wo man eine Pizzeria bestellen möchte... so dann wählt man in der ersten Box ein Bundesland... die 2. Box wird "Freigeschaltet" und in der 2. Box werden dann die größten Städte des gewählten Bundeslandes geladen und angezeigt die man dort auch auswählen kann...

mfg

EDIT:
Ich habe mich noch mal ein bisschen umgeschaut und dann diesen Script gefunden:
HTML:
<html>
<head>
    <title></title>

    <script type="text/javascript">
        var mygroup = new Array();

        // reset
        mygroup[0] = new Array();
        mygroup[0][0] = new Option("Bitte wählen Sie zunächst ein Bundesland.", 0);

        // Baden-Würtenberg
        mygroup[1] = new Array();
        mygroup[1][0] = new Option("Stuttgart", 2);
        mygroup[1][1] = new Option("Freiburg", 4);
        mygroup[1][2] = new Option("Villingen-Schwenningen", 8);

        // NRW
        mygroup[2] = new Array();
        mygroup[2][0] = new Option("Köln",   1);
        mygroup[2][1] = new Option("Düsseldorf",   3);
        mygroup[2][2] = new Option("Dortmund", 9);

        // Berlin
        mygroup[3] = new Array();
        mygroup[3][0] = new Option("Tempelhof",    5);
        mygroup[3][1] = new Option("Schönefeld",  50);
        mygroup[3][2] = new Option("keine ahnung was es noch gibt :D", 500);

        // mygroup[ZB_PRIMARY_KEY_SELECT][FORTLAUFENDE_ZAHLEN_AB_0] = new Option(OPTION_TEXT, ZB_PRIMARY_KEY_SUBSELECT)

        // alle <option>s des sub-<select> entfernen
        function ResetSubSelect(form, subSelect)
        {
            var e = form.elements[subSelect];
            for (var i = 0; i < e.options.length; ++i) {
                e.options[i] = null;
            }
        }

        // übergebenes Element (sub-<select>) deaktivieren
        function DisableSubSelect(elem)
        {
            elem.disabled = 1;
        }

        // übergebenes Element (sub-<select>) aktivieren
        function EnableSubSelect(elem)
        {
            elem.disabled = 0;
        }

        // tritt bei onchange in Kraft, bzw. bei der Initiierung
        function ShowSubSelect(elem, subSelect)
        {
            // alle <option>s des sub-<select> entfernen (reset)
            ResetSubSelect(elem.form, subSelect);

            // welcher value wurde ausgewählt
            var i = elem.options[elem.selectedIndex].value;
            // sub-<select>
            var s = elem.form.elements[subSelect];

            // dem <sub>-select die <option>s aus mygroup zuordnen
            for (var k = 0; k < mygroup[i].length; k++) {
                s.options[k] = mygroup[i][k];
            }

            // war die ausgewählte value 0? dann sub-<select> deaktivieren
            if (i == 0) {
                DisableSubSelect(s);
            } else {
                EnableSubSelect(s);
            }
        }

        function InitSubSelect()
        {
            // leeres sub-<select> mit mygroup[0] füllen
            ShowSubSelect(document.forms["myform"].elements["myselect"], "mysubselect");
        }
    </script>
</head>
<body onload="InitSubSelect()">

<form action="" method="get" name="myform">
    <select name="myselect" onchange="ShowSubSelect(this,'mysubselect')">
        <option value="0">Bitte wählen Sie eine Bundesland.</option>
        <option value="1">Baden-Würtenberg</option>
        <option value="2">NRW</option>
        <option value="3">Berlin</option>
    </select>

    <select name="mysubselect" disabled="disabled">
    </select>

    <input type="submit" value="Suchen" />
</form>

</body>
</html>
So jetzt kenne ich mich mit Java nicht so gut aus und weiß leider nicht wie ich es mache, dass wenn ich auf "Daten absende" klicke ich auf eine andere HTML seite weitergeleitet werde...

könnte mir jmd. dabei behilflisch sein? :/
 
Zuletzt bearbeitet:
Moin Moin,

man kann das ganze sehr schön mit jquery und AJAX lösen. Sobald Du bei der Selectbox den Eintrag änderst schickt das Script einen Request an den Server und holt die jeweiligen Städte aus der Db, oder sonst woher und liefert sie als JSON Object zurück.

Code:
<script>
    $(document).ready(function() {
        $('#id_der_selectbox').change(function(){
            $.getJSON('http://irgendeineURL/updateBox.php', {'argument' : $(this).val()},parseRet);
        
    });
    
   function parseRet(data) {
       output = '';
       $.each(data, function(i,item){
           output += '<option value="' +item.id+ '">' + item.name + '</option>';
       });
       $('#die_zweite_selectbox').html(output);
   }
</script>

Und ein passendes PHP Script könnte dann so aussehen:

PHP:
<?php

if(isset($_GET['argument']) && !empty($_GET['argument'])) {
   
	
    $staedte = holdieStaedteAusDerDatenbank($_GET['argument']);
	
    echo json_encode($staedte);
}

?>

Mehr zu jquery kannst Du hier finden jQuery: The Write Less, Do More, JavaScript Library

Gruß
/martin
 
Zurück
Oben