PHPhulp
 
 
Header image
Username: Password:   registreren | wachtwoord kwijt
 


PHP scripts

Dynamic Linked Dropdown Menu (PHP,MYSQL,JAVASCRIPT

Niveau: Gevorderd
PHP versie: 5
Categorie: Databases
Voorbeeld: http://www.autotrader.nl

Door Jeroen de Jonge op 12.12.2005

Print versie PHP script

Toelichting:
Aangezien mijn test server's HD gecrashed is en hierdoor vanavond niets kan doen. Word het eens tijd om wat code te delen met de gebruikers hier. Aangezien ik vaak tips en tricks hier vandaan heb gehaald(bedankt hiervoor). In mijn zoektocht op internet naar het onderstaande script heb ik alleen nog maar bot gevangen. Daarom hier de uitgewerkte code voor een dynamic linked dropdown select uit mysql.

Script 1: Geeft 2 gelinkte dropdown boxes
Bijvoorbeeld: 1e dropdown menu - selecteer auto merk
de 2e dropdown word gevuld met waarden die relevant zijn voor wat in de eerste dropdown is geselecteerd.
Bijvoorbeeld eerste selectie vak is volvo
De 2de groep geeft dan de opties week s40 s50 s60 etc etc

Hieronder staan 3 scripts: respectievelijk 2 , 3 en 4 dropdowns.

Afhankelijk van de groote van je database en de snelheid van je server zou ik het aantal records beperkt houden.
stel 2 dropdowns genereren 1 kb aan code, 3 dropdowns hebben deze hoeveelheid in het kwadraat

Er kan gebruik gemaakt worden van één enkele tabel waarin alles staat
| volvo | S60 | Diesel | 1998
| volvo | S70 | Benzine | 1995
| volvo | S80 | LPG | 1997

De script werken met een globale variabele waar telkens stukjes code in worden gedropt naarmaate php de code verwerkt.

De code is gemakkelijk te converteren voor andere toepassingen om dat het geheel is opgezet als functie.
Vul boven in de database, username, password etc in.
Vul vervolgens onderaan in het script
dual_select('naam_kolom1', 'naam_kolom2' etc etc) en het script is al werkend.

Code:
CODE VOOR DUAL-SELECT

 Selecteer deze code
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
<?
// Database connection
$db_database = 'databasename';
$db_host = 'localhost';
$db_user = 'username';
$db_pass = 'password';
mysql_connect($db_host,$db_user,$db_pass) or die("Could not connect to MySQL (Main connection)");
mysql_select_db($db_database) or die("Could not connect to database (Main connection)");


function dual_linked_select(
$table,            // Table to create linked selects from
$table_column_01,        // Root category
$table_column_02,        // Subcategory of the root category
$group_02_default_option_text    // Default option text for the group 2 select
)
{

// Define globals
    global $javascript;
    global $group_01_options;
    // Define variables
    $javascript = null; // Hold
    $group_01_options = null;//Hold

// Assembly of Javascript starts
    $javascript .=<<<content
    /* Linked Dropdown Selects Script Start */
    function DefaultGroup2()
    {
        var x = document.getElementById("Group2");
        x.length = 0;
        VarGroup2 = document.getElementById("Group2");
        VarGroup2.options[VarGroup2.options.length] = new Option("$group_02_default_option_text","");
        document.getElementById("Group2").disabled = true;
    }

    function CheckGroup1Select()
    {
        // If no Group1 is selected clear the Group2 and set to default
        if(document.getElementById("Group1").value == "")
        {
        // Clear the Group2 select and set to default value
        DefaultGroup2();
        }

content;

// Javascript 
    $group_01_query = "SELECT ".$table_column_01." FROM ".$table." GROUP BY ".$table_column_01;
    $group_01_result = mysql_query($group_01_query) or die(mysql_error());
    while($group_01 = mysql_fetch_array($group_01_result))
    {
        $group_01_options .= '<option value="'.$group_01[$table_column_01].'">'.$group_01[$table_column_01].'</option>'."\r\n";

        $javascript .=<<<content
        else if(document.getElementById("Group1").value == "$group_01[$table_column_01]")
        {
            // Clear the Group2 and set to default value
            DefaultGroup2();
            // Set variable options for Group2 select
            VarGroup2 = document.getElementById("Group2");

content;

        $group_02_query = "SELECT ".$table_column_02." FROM ".$table." WHERE ".$table_column_01." = '".$group_01[$table_column_01]."' GROUP BY ".$table_column_02;
        $group_02_result = mysql_query($group_02_query) or die(mysql_error());
        while($group_02 = mysql_fetch_array($group_02_result))
        {
            $javascript .='            VarGroup2.options[VarGroup2.options.length] = new Option("'.$group_02[$table_column_02].'","'.$group_02[$table_column_02].'");'."\r\n";
        }

            $javascript .=<<<content
            document.getElementById("Group2").disabled = false;

        }

content;
    }
        $javascript .='    }'."\r\n";

} // End of dual_linked_selects function
?>

<?
// execute dual_linked_selects_function
dual_linked_select('tabel_name','table_column1','tablecolumn2','Select...');
?>

<html>
<head>
    <title>Dual Linked Selects with PHP and MYSQL (without page reload)</title>
<script type="text/javascript" language="JavaScript">
<? echo $javascript; ?>
</script>
</head>

<body>
<form action="">
Group1:
<br>
<select id="Group1" name="group1" onchange="CheckGroup1Select(this);">
<option value="">Select...</option>
<? echo $group_01_options; ?>
</select>

<br>
Group2:
<br>
<select id="Group2" name="group2"></select>

</form>
</body>

</html>


CODE VOOR TRIPLE SELECT

 Selecteer deze code
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
<?
// Database connection
$db_database = 'databasename';
$db_host = 'localhost';
$db_user = 'username';
$db_pass = 'password';
mysql_connect($db_host,$db_user,$db_pass) or die("Could not connect to MySQL (Main connection)");
mysql_select_db($db_database) or die("Could not connect to database (Main connection)");

// Start of triple_linked_selects function
function triple_linked_selects(
$table,        // Table to create linked selects from
$table_column_01,    // Root category
$table_column_02,    // Subcategory of the root category
$table_column_03,    // Available items in subcategory of the root category
$group_02_default_option_text,    // Default option text for the group 2 select
$group_03_default_option_text)    // Default option text for the group 3 select

{
// Define globals
    global $javascript;
    global $group_01_options;
// Define variables
    $javascript = null; // Holds all the generated javascript
    $group_01_options = null; // Holds all the select options for group 1

// Static Javascript
    $javascript .=<<<content
    /* Linked Dropdown Selects Script Start */
    function DefaultGroup2()
    {
        var x = document.getElementById("Group2");
        x.length = 0;
        VarGroup2 = document.getElementById("Group2");
        VarGroup2.options[VarGroup2.options.length] = new Option("$group_02_default_option_text","");
        document.getElementById("Group2").disabled = true;
    }

    function DefaultGroup3()
    {
        var x = document.getElementById("Group3");
        x.length = 0;
        VarGroup3 = document.getElementById("Group3");
        VarGroup3.options[VarGroup3.options.length] = new Option("$group_03_default_option_text","");
        document.getElementById("Group3").disabled = true;
    }

    function ClearGroup3()
    {
        var x = document.getElementById("Group3");
        x.length = 0;
        document.getElementById("Group3").disabled = false;
    }

    function CheckGroup1Select()
    {
        // If no Group1 is selected clear the Group2 and Group3 selects and set them to their default values
        if(document.getElementById("Group1").value == "")
        {
            // Clear the Group2 select and set to default value
            DefaultGroup2();
            // Clear the Group3 select and set to default value
            DefaultGroup3();
        }

content;

// Groups 1 & 2 Javascript
    $group_01_query = "SELECT ".$table_column_01." FROM ".$table." GROUP BY ".$table_column_01;
    $group_01_result = mysql_query($group_01_query) or die(mysql_error());
    while($group_01 = mysql_fetch_array($group_01_result))
    {
        $group_01_options .= '<option value="'.$group_01[$table_column_01].'">'.$group_01[$table_column_01].'</option>'."\r\n";

        $javascript .=<<<content
        else if(document.getElementById("Group1").value == "$group_01[$table_column_01]")
        {
            // Clear the Group2 select and set to default value
            DefaultGroup2();
            // Set dynamic options for Group2 select
            VarGroup2 = document.getElementById("Group2");

content;

        $group_02_query = "SELECT ".$table_column_02." FROM ".$table." WHERE ".$table_column_01." = '".$group_01[$table_column_01]."' GROUP BY ".$table_column_02;
        $group_02_result = mysql_query($group_02_query) or die(mysql_error());
        while($group_02 = mysql_fetch_array($group_02_result))
        {
            $javascript .='            VarGroup2.options[VarGroup2.options.length] = new Option("'.$group_02[$table_column_02].'","'.$group_02[$table_column_02].'");'."\r\n";
        }

            $javascript .=<<<content
            document.getElementById("Group2").disabled = false;
            // Clear the Group3 select and set to default value
            DefaultGroup3();
        }

content;
    }
        $javascript .='    }'."\r\n";

// Group 3 Javascript 

    $javascript .=<<<content
    function CheckGroup2Select()
    {

content;

    $group_01_query = "SELECT ".$table_column_01." FROM ".$table." GROUP BY ".$table_column_01;
    $group_01_result = mysql_query($group_01_query) or die(mysql_error());
    while($group_01 = mysql_fetch_array($group_01_result))
    {

    $javascript .=<<<content
        if((document.getElementById("Group1").value == "$group_01[$table_column_01]") && (!document.getElementById("Group2").value))
        {
            // Clear the Group3 select and set to default value
            DefaultGroup3();
        }

content;

        $group_02_query = "SELECT ".$table_column_02." FROM ".$table." WHERE ".$table_column_01." = '".$group_01[$table_column_01]."' GROUP BY ".$table_column_01.",".$table_column_02;
        $group_02_result = mysql_query($group_02_query) or die(mysql_error());
        while($group_02 = mysql_fetch_array($group_02_result))
        {

        $javascript .=<<<content
        else if((document.getElementById("Group1").value == "$group_01[$table_column_01]") && (document.getElementById("Group2").value == "$group_02[$table_column_02]"))
        {
            ClearGroup3();
            VarGroup3 = document.getElementById("Group3");

content;

            $group_03_query = "SELECT * FROM ".$table." WHERE ".$table_column_02." = '".$group_02[$table_column_02]."' AND ".$table_column_01." = '".$group_01[$table_column_01]."'  GROUP BY ".$table_column_03;
            $group_03_result = mysql_query($group_03_query) or die(mysql_error());
            while($group_03 = mysql_fetch_array($group_03_result))
            {
                $javascript .='            VarGroup3.options[VarGroup3.options.length] = new Option("'.$group_03[$table_column_03].'","'.$group_03[$table_column_03].'");'."\r\n";
            }
    $javascript .='        }'."\r\n";
        }
    }

    $javascript .=<<<content
    }

    window.onload = CheckGroup1Select;
    /* Linked Dropdown Selects Script End */

content;

} // End of triple_linked_selects function
?>

<?
// Call the triple_linked_selects function
triple_linked_selects('tabel_name','table_column1','tablecolumn2','tablecolumn3','Select...','------------');
?>

<html>
<head>
    <title>Triple Linked Selects</title>
<script type="text/javascript" language="JavaScript">
<? echo $javascript; ?>
</script>
</head>

<body>
<form action="">
Group1:
<br>
<select id="Group1" name="Group1" onchange="CheckGroup1Select(this);">
<option value="">Select...</option>
<? echo $group_01_options; ?>
</select>

<br>
Group2:
<br>
<select id="Group2" name="Group2" onchange="CheckGroup2Select(this);"></select>

<br>
Group3:
<br>
<select id="Group3" name="Group3"></select>
</form>
</body>
</html>


CODE VOOR QUAD SELECT

 Selecteer deze code
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
<?
// Database connection
$db_database = 'databasename';
$db_host = 'localhost';
$db_user = 'username';
$db_pass = 'password';
mysql_connect($db_host,$db_user,$db_pass) or die("Could not connect to MySQL (Main connection)");
mysql_select_db($db_database) or die("Could not connect to database (Main connection)");

// Start of quad_linked_selects function
function quad_linked_selects(
$table,        // Table name
$table_column_01,    // Root category
$table_column_02,    // Available items in sub category
$table_column_03,    // Available items in sub-sub category
$table_column_04,    // Available items in sub-sub-sub category
$group_02_default_option_text,    // Default option text for the group 2 select
$group_03_default_option_text,    // Default option text for the group 3 select
$group_04_default_option_text)    // Default option text for the group 4 select
{
// Define globals
    global $javascript;
    global $group_01_options;
// Define variables
    $javascript = null; // Holds all the generated javascript
    $group_01_options = null; // Holds all the select options for group 1

// Static Javascript
    $javascript .=<<<content
    /* Linked Dropdown Selects Script Start */
    function DefaultGroup2()
    {
        var x = document.getElementById("Group2");
        x.length = 0;
        VarGroup2 = document.getElementById("Group2");
        VarGroup2.options[VarGroup2.options.length] = new Option("$group_02_default_option_text","");
        document.getElementById("Group2").disabled = true;
    }

    function DefaultGroup3()
    {
        var x = document.getElementById("Group3");
        x.length = 0;
        VarGroup3 = document.getElementById("Group3");
        VarGroup3.options[VarGroup3.options.length] = new Option("$group_03_default_option_text","");
        document.getElementById("Group3").disabled = true;
    }

    function DefaultGroup4()
    {
        var x = document.getElementById("Group4");
        x.length = 0;
        VarGroup4 = document.getElementById("Group4");
        VarGroup4.options[VarGroup4.options.length] = new Option("$group_04_default_option_text","");
        document.getElementById("Group4").disabled = true;
    }

    function ClearGroup3()
    {
        var x = document.getElementById("Group3");
        x.length = 0;
        document.getElementById("Group3").disabled = false;
    }

    function ClearGroup4()
    {
        var x = document.getElementById("Group4");
        x.length = 0;
        document.getElementById("Group4").disabled = false;
    }

    function CheckGroup1Select()
    {
        // If no Group1 is selected clear the Group2 and Group3 selects and set them to their default values
        if(document.getElementById("Group1").value == "")
        {
            // Clear the Group2 select and set to default value
            DefaultGroup2();
            // Clear the Group3 select and set to default value
            DefaultGroup3();
            // Clear the Group4 select and set to default value
            DefaultGroup4();
        }

content;

// Groups 1 & 2 Javascript
    $group_01_query = "SELECT ".$table_column_01." FROM ".$table." GROUP BY ".$table_column_01;
    $group_01_result = mysql_query($group_01_query) or die(mysql_error());
    while($group_01 = mysql_fetch_array($group_01_result))
    {
        $group_01_options .= '<option value="'.$group_01[$table_column_01].'">'.$group_01[$table_column_01].'</option>'."\r\n";

        $javascript .=<<<content
        else if(document.getElementById("Group1").value == "$group_01[$table_column_01]")
        {
            // Clear the Group2 select and set to default value
            DefaultGroup2();
            // Set dynamic options for Group2 select
            VarGroup2 = document.getElementById("Group2");

content;

        $group_02_query = "SELECT ".$table_column_02." FROM ".$table." WHERE ".$table_column_01." = '".$group_01[$table_column_01]."' GROUP BY ".$table_column_02;
        $group_02_result = mysql_query($group_02_query) or die(mysql_error());
        while($group_02 = mysql_fetch_array($group_02_result))
        {
            $javascript .='            VarGroup2.options[VarGroup2.options.length] = new Option("'.$group_02[$table_column_02].'","'.$group_02[$table_column_02].'");'."\r\n";
        }

            $javascript .=<<<content
            document.getElementById("Group2").disabled = false;
            // Clear the Group3 select and set to default value
            DefaultGroup3();
            DefaultGroup4();
        }

content;
    }
        $javascript .='    }'."\r\n";

// Group 3 Javascript 
    $javascript .=<<<content
    function CheckGroup2Select()
    {

content;

    $group_01_query = "SELECT ".$table_column_01." FROM ".$table." GROUP BY ".$table_column_01;
    $group_01_result = mysql_query($group_01_query) or die(mysql_error());
    while($group_01 = mysql_fetch_array($group_01_result))
    {

    $javascript .=<<<content
        if((document.getElementById("Group1").value == "$group_01[$table_column_01]") && (!document.getElementById("Group2").value))
        {
            // Clear the Group3&4 select and set to default value
            DefaultGroup3();
            DefaultGroup4();
        }

content;

        $group_02_query = "SELECT ".$table_column_02." FROM ".$table." WHERE ".$table_column_01." = '".$group_01[$table_column_01]."' GROUP BY ".$table_column_01.",".$table_column_02;
        $group_02_result = mysql_query($group_02_query) or die(mysql_error());
        while($group_02 = mysql_fetch_array($group_02_result))
        {

        $javascript .=<<<content
        else if((document.getElementById("Group1").value == "$group_01[$table_column_01]") && (document.getElementById("Group2").value == "$group_02[$table_column_02]"))
        {
            DefaultGroup3();
            VarGroup3 = document.getElementById("Group3");

content;
            $group_03_query = "SELECT * FROM ".$table." WHERE ".$table_column_02." = '".$group_02[$table_column_02]."' AND ".$table_column_01." = '".$group_01[$table_column_01]."'  GROUP BY ".$table_column_03;
            $group_03_result = mysql_query($group_03_query) or die(mysql_error());
            while($group_03 = mysql_fetch_array($group_03_result))
            {
                $javascript .='            VarGroup3.options[VarGroup3.options.length] = new Option("'.$group_03[$table_column_03].'","'.$group_03[$table_column_03].'");'."\r\n"            ;
            }
    $javascript .='            document.getElementById("Group3").disabled = false;
            DefaultGroup4();
        }'."\r\n";
        }
    }

    $javascript .=<<<content
    }
    

content;


// Group 4 Javascript 
    $javascript .=<<<content
    function CheckGroup3Select()
    {

content;

    $group_01_query = "SELECT ".$table_column_01.", ".$table_column_02." FROM ".$table." GROUP BY ".$table_column_02;
    $group_01_result = mysql_query($group_01_query) or die(mysql_error());
    while($group_01 = mysql_fetch_array($group_01_result))
    {

    $javascript .=<<<content
        if((document.getElementById("Group2").value == "$group_01[$table_column_02]") && (document.getElementById("Group3").value == "$group_01[$table_column_03]") && (!document.getElementById("Group4").value))
        {
            // Clear the Group4 select and set to default value
            DefaultGroup4();
        }

content;

        $group_02_query = "SELECT ".$table_column_02.", ".$table_column_03." FROM ".$table." WHERE ".$table_column_02." = '".$group_01[$table_column_02]."' GROUP BY ".$table_column_02.",".$table_column_03;
        $group_02_result = mysql_query($group_02_query) or die(mysql_error());
        while($group_02 = mysql_fetch_array($group_02_result))
        {

        $javascript .=<<<content
        else if((document.getElementById("Group2").value == "$group_01[$table_column_02]") && (document.getElementById("Group3").value == "$group_02[$table_column_03]"))
        {
            DefaultGroup4();
            VarGroup4 = document.getElementById("Group4");

content;

            $group_03_query = "SELECT * FROM ".$table." WHERE ".$table_column_03." = '".$group_02[$table_column_03]."' AND ".$table_column_02." = '".$group_01[$table_column_02]."'  GROUP BY ".$table_column_04;
            $group_03_result = mysql_query($group_03_query) or die(mysql_error());
            while($group_03 = mysql_fetch_array($group_03_result))
            {
                $javascript .='            VarGroup4.options[VarGroup4.options.length] = new Option("'.$group_03[$table_column_04].'","'.$group_03[$table_column_04].'");'."\r\n";
            }
    $javascript .='            document.getElementById("Group4").disabled = false;

                        }'."\r\n";
        }
    }

    $javascript .=<<<content
    }

    window.onload = CheckGroup1Select;
    /* Linked Dropdown Selects Script End */

content;



} // End of quad_linked_selects function
?>

<?
// Call the quad_linked_selects function
quad_linked_selects('tablename','tablecolumn1','tablecolumn2','tablecolumn3','tablecolumn4','Select...','------------','------------');
?>


<html>
<head>
    <title>Triple Linked Selects</title>
<script type="text/javascript" language="JavaScript">
<? echo $javascript; ?>
</script>
</head>

<body>
<form action="">
Group1:
<br>
<select id="Group1" name="Group1" onchange="CheckGroup1Select(this);">
<option value="">Select...</option>
<? echo $group_01_options; ?>
</select>

<br>
Group2:
<br>
<select id="Group2" name="Group2" onchange="CheckGroup2Select(this);"></select>

<br>
Group3:
<br>
<select id="Group3" name="Group3" onchange="CheckGroup3Select(this);"></select>

<br>
Group4:
<br>
<select id="Group4" name="Group4"></select>

</form>
</body>
</html>


Meer PHP scripts in deze categorie Meer PHP scripts in deze categorie

Reacties

Voeg ook een reactie toe.

Jeroen de Jonge schreef op 12.12.2005 23:46
De code is makkelijk uit te breiden met 5, 6 of meer selectboxen.
Bekijk de broncode hoe het uiteindelijke script er uit komt te zien.

Jelmer schreef op 12.12.2005 23:47
Oeh, dat wordt lang laden met veel opties.
(Ik zie hier weer een AJAX-to-the-rescue situatie :)

En misschien eens nadenken over het algemenizeren van je javascript, wat zeg ik, je hele script. Je kan javascript ten eerste veel makkelijker gewoon in een keer 4 keer laten genereren door PHP door een nummertje op te hogen (en zo een tot-oneindig-select maken) maar je kan ook gewoon een algemeen javascriptje maken, dat zich via een extra paramter aanpast. Kijk zowiezo eens naar array's (voor het php-gebeuren, dan hoef je niet het aantal argumenten per functie te laten verschillen) en naar meer argumenten meegeven in javascript. Je kan via 'this' ook de naam uitlezen van het select-menu, en aan de had daarvan de goede array pakken. Scheelt 3 functies in het laatste geval.

Kasper schreef op 13.12.2005 03:51
Oeh, dat wordt lang laden met veel opties.
(Ik zie hier weer een AJAX-to-the-rescue situatie :)

Kan AJAX dat lange laden oplossen dan? AJAX laadt immers alles in 1x en ververst alleen de benodigde delen daarna, of heb ik me nou verkeerd ingelezen?

Ik zie trouwens iets anders: iemand die een mooie tutorial over AJAX kan schrijven ;)

Cartman schreef op 13.12.2005 09:31
Als het maar niet over voetbal gaat :p...

lissy schreef op 13.12.2005 10:21
Beste Jeroen,

Wanneer ik vermeld wie dit heeft geschreven vind je dan goed dat ik het in mijn scripten bibliotheek plaats op mijn site?

In iedergeval bedankt voor het delen!
Groet, lissy

Robert_Deiman schreef op 13.12.2005 11:10
Leuk script.. Alleen bij dat voorbeeld dat je hebt, werkt het al met AJAX, als ik het goed heb. Probeer maar eens een merk te selecteren bij autotrader, je krijg DIRECT, dus zonder REFRESH de typen in een lijstje behorende bij een bepaald merk.
Kijk, dat noem ik nog eens een supervoorbeeld van het gebruik van AJAX, er wordt niet gerefreshed, waardoor het super werkt.
Ik kan overigens geen tut over AJAX schrijven, want ik weet niet hoe het precies werkt, ik weet alleen dat het in zo'n situatie superhandig kan zijn.

DaeDaluz schreef op 13.12.2005 13:21
http://www.howtocreate.co.uk/tutorials/testMenu.html

Dit lijkt mij makkelijker, maar toch wel een leuk script :)

Jeroen de Jonge schreef op 13.12.2005 19:19
@lizzy. Plaats het script waar je wilt.

@Robert. Misschie verkeerd voorbeeld maar het was de eerste site die me te binnen schoot volgens dit principe.

lissy schreef op 13.12.2005 20:03
@ Jeroen : BEDANKT dan komt hij bij mij :-)

PHPerik schreef op 14.12.2005 11:45
Ik vind de highlighting van de javascript hierboven niet zo duidelijk en ik heb hier geen Dreamweaver of jEdit, maar dit lijkt geen AJAX.

Ik zal vanavond een tutorial schrijven over AJAX en de do's en vooral don'ts als ik tijd heb.

Gifo schreef op 16.12.2005 13:36
Hoi,

Ik krijg de volgende melding:

Parse error: parse error, unexpected T_SL in /home/virtual/site405/fst/var/www/html/manager/dualselect.php on line 27

Line 27 is volgens mij deze:
$javascript .=<<<content

Iemand enig idee hoe ik dit oplos?

Gifo schreef op 16.12.2005 14:08
Laat maar, heb het al gevonden!

Achter de code $javascript .=<<<content
stond nog een spatie, die moest weg!

Zelfde overigens in regel 74!

Gifo schreef op 16.12.2005 14:19
TOP script, werkt inmiddels goed.

Wat ik alleen nu nog graag zou willen is dat ik twee selecties gemaakt hebt en dat er dan als 3e een waarde uitkomt.
Dat gebeurd nu wel bij de Triple select versie, maar dan komt als 3e weer een selectievakje te staan en hier zou ik graag een niet aan te passen warade willen hebben.

Iemand een idee hoe dit aan te passen is??

Gifo schreef op 16.12.2005 17:10
2 vragen:

1) als ik het test met zelf ingevulde gegevens werkt het goed. Als ik echter gegevens vanuit excel inlees geeft het script de volegnde fout melding: You have an error in your SQL syntax near 's' GROUP BY spelernaam' at line 1

Iemand een idee waar dat aan ligt?

2) ik wil eigenlijk graag dit script meerdere malen op dezelfde pagina hebben. Dit werkt echter niet.
Iemand???

Jeroen de Jonge schreef op 16.12.2005 19:19
@ Balletje schreef op 16.12.2005 14:19
// Group 3 Javascript

$javascript .=<<<content
function CheckGroup2Select()
{

content;

$group_01_query = "SELECT ".$table_column_01." FROM ".$table." GROUP BY ".$table_column_01;
$group_01_result = mysql_query($group_01_query) or die(mysql_error());
while($group_01 = mysql_fetch_array($group_01_result))
{

$javascript .=<<<content
if((document.getElementById("Group1").value == "$group_01[$table_column_01]") && (!document.getElementById("Group2").value))
{
// Clear the Group3 select and set to default value
DefaultGroup3();
}

{DefaultGroup3();} verwijderen.

DIt werkt alleen als er maar 1 mogelijke optie is.

Jeroen de Jonge schreef op 16.12.2005 19:29
@ Balletje schreef op 16.12.2005 14:19

eh, dat wat tussen {} staat natuurlijk :-)

Gifo schreef op 20.12.2005 23:29
@Jeroen:

Hartstikke goed. Werkt!

Weet je ook hoe ik hetzelfde script meerdere malen op dezelfde pagina kan laten uitvoeren (12 keer zelfs)?
Ik heb al gebrpobeerd met de nummering maar daar kom ik er niet uit.

Gifo schreef op 29.12.2005 11:50
Is inmiddels gelukt.
Door middel van het aanpassen van de nummering en het aanpassen van $javascript in $javascript 1, 2 etc lukt het wel!

Elsy schreef op 02.01.2006 13:24
Ik krijg een foutmelding:Parse error: parse error, unexpected T_CONSTANT_ENCAPSED_STRING in

regel 63:content;

$group_02_query = "SELECT ".$table_column_02." FROM ".$table." WHERE ".$table_column_01." """= """=""="='".$group_01[$table_column_01]."' GROUP BY ".$table_column_02;
$group_02_result = mysql_query($group_02_query) or die(mysql_error());



Waar vul je je tabelnamen uit de database in?

Jeroen de Jonge schreef op 02.01.2006 23:09
Hallo Elsy

Het script hierboven zijn 3 scripts voor respectievelijk 2,3 en 4 dropdowns neem alleen het gedeelte dat je nodig hebt. Door het knippen en plakken kan het zijn dat er een paar spaties weggevallen zijn.

De database waaruit de selectie plaatsvind staat boven aan in script
$db_database = 'databasename';

Het gehele script is een grote functie die in een keer aangeroepen word door middel van (dit is voor de 4 dropdowns)
 Selecteer deze code
1
2
3
<?php
quad_linked_selects('tablename','tablecolumn1','tablecolumn2','tablecolumn3','tablecolumn4','Select...','------------','------------'); 
?>

waarbij:
tablename de naam van de tabel is
tablecolumn1 - de naam van kolom 1
tablecolumn2 - de naam van kolom 2
tablecolumn3 - de naam van kolom 3
tablecolumn4 - de naam van kolom 4
Select - standaard waarde1 voor de dropdown als er nog niets geselecteerd is
----------standaard waarde2 voor de dropdown als er nog niets geselecteerd is
----------standaard waarde3 voor de dropdown als er nog niets geselecteerd is
----------standaard waarde4 voor de dropdown als er nog niets geselecteerd is

Crispijn schreef op 02.04.2006 23:08
Super script! Echt heel toevallig dat dit nu verschijnt! Ik kan het heel erg goed gebruiken bij mijn projectje!

Bedankt Jeroen!

Wout schreef op 28.08.2006 12:33
Ik krijg constant de fout;

Notice: Lost connection to MySQL server during query in W:\Web\Index\Service\installatieoverzicht\linkselect.php on line 89

Warning: mysql_fetch_array(): supplied argument is not a valid MySQL result resource in W:\Web\Index\Service\installatieoverzicht\linkselect.php on line 90


regel 88 t/m 91 zijn:

 Selecteer deze code
1
2
3
4
$group_02_query = "SELECT ".$table_column_02." FROM ".$table." WHERE ".$table_column_01." = '".$group_01[$table_column_01]."' GROUP BY ".$table_column_02 or trigger_error(mysql_error()); 
        $group_02_result = mysql_query($group_02_query) or trigger_error(mysql_error());
        while($group_02 = mysql_fetch_array($group_02_result))
        {

MarcoG schreef op 15.09.2006 20:34
Prima script maar kan iemand mij helpen met het volgende:
de laatste selectbox wil ik laten bestaan uit meerder velden.
Voorbeeld Voornaam en Achternaam van een bepaald iemand.
Dus men selecteert het geslacht en dan wil ik dus de voornaam en achternaam tonen waaruit een selectie gemaakt kan worden.(In mijn DB zijn dit namelijk twee verschillende velden).

wim schreef op 05.10.2006 01:43
hoe kan ik nu alles printen wat in een category zit nadat je de 4 dropdowns hebt geselecteerd?
alvast bedankt

wim schreef op 09.10.2006 05:53
niemand ? :p

arnaud schreef op 31.01.2007 20:33
Ja Wim
Dat was / is ook mijn vraag.
schopje

Arnaud

ziad schreef op 28.06.2007 15:01
Is thit possible to edit this script,

If we choose "ALL' in the first dropdown, can you tell me how to list all rows in the second dropdown? Same for the third and fourth dropdown.

Waiting your urgent reply, many thanks.

ziad schreef op 28.06.2007 15:07
Is thit mogelijk om dit manuscript uit te geven,

Als wij "ALLEN" in eerste dropdown kiezen, kunt u me hoe te om van alle rijen in tweede dropdown een lijst te maken vertellen? Zelfde voor het derde en vierde dropdown.

Het wachten van uw dringend antwoord, vele dank.

PHP Newbie schreef op 28.06.2007 18:29
Hmm, a translation machine isn't the best option Ziad.

I think you could better open a topic in the main forum. Try it in English, I think there will be people who can help you in English.

Otherwise you'll have to try a English forum...

marco Jonker schreef op 30.07.2007 14:27
Misschien kan iemand mij een tip geven omdat het bij mij nog niet helemaal goed werkt. (Het gaat bij mij om DUAL-SELECT)
Het eerste menu werkt goed, maar de data voor het tweede menu dat van keuze 1 afhankelijk is, is niet zichtbaar.
Kijk ik echter naar de broncode dan zie ik wel alle relevante keuzes.
De data is dus wel goed opgehaald.
Het lijkt er dus op dat het switchen van het tweede menu niet goed werkt.

Graag een tip

Groeten

malick schreef op 17.09.2007 14:07
hmmm ik krijg de error Tabel 'abc.tabel_name' bestaat niet

Mark Kazemier schreef op 26.11.2007 19:16
Ik heb even een hele flauwe vraag als jullie het niet erg vinden (is bedoelt als een subtiele hint ;))
Wat is het verschil tussen:
 Selecteer deze code
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function DefaultGroup2()
    {
        var x = document.getElementById("Group2");
        x.length = 0;
        VarGroup2 = document.getElementById("Group2");
        VarGroup2.options[VarGroup2.options.length] = new Option("$group_02_default_option_text","");
        document.getElementById("Group2").disabled = true;
    }

    function DefaultGroup3()
    {
        var x = document.getElementById("Group3");
        x.length = 0;
        VarGroup3 = document.getElementById("Group3");
        VarGroup3.options[VarGroup3.options.length] = new Option("$group_03_default_option_text","");
        document.getElementById("Group3").disabled = true;
    }
?

En zo in de PHP ook een paar verschillende stukken voor het maken van de queries.

Je hebt het in de javascript nu mooi ingedeeld in functies. Het verschil tussen de methoden is alleen dat nummertje van Group3. Is daar niet de parameter voor uitgevonden? Dan kan je het oplossen met 1 methode.
Voor de PHP geldt hetzelfde. Zet die query in een functie met als parameter het nummertje en je kan het oplossen met 1 functie en een aantal aanroepen.

Voordelen:
Minder typ werk
Wat nu als je een veld meer wil selecteren? Moet je het 5 keer gaan aanpassen. Met 1 methode maar 1 keer.
Overzichtelijker.

Stefan schreef op 08.12.2007 13:59
Dit script ziet er goed uit, weet iemand een bestaand script die deze gegeven dmv een output verzend via e-mail. (ik wil hier een offerte systeem van maken)

dat word het zoiets als: product 1 met die en die opties ---> output verzenden naar mail.

Anders doe ik zelf een poging om het te schrijven,

mvg, stefan

niek schreef op 19.12.2007 10:15
Kan iemand mij precies vertellen hoe ik een 5e veld kan toevoegen want dat krijg ik niet voor elkaar. Ik heb een $group_04_query toegevoegd en de nummering aangepast, maar de dropdowns blijven leeg..

Koosje schreef op 27.12.2007 12:50
Hoi,

ik ben er als newbie er met moeite uit gekomen. Waar ik niet uitkom is dat, en dat is mij de bedoeling, er gezocht wordt met het laatste select box in een mysql databse en de resultaten weergeeft. Tot dus verre verschijnt de submit button ook als invoerveld:

<FORM METHOD=\"POST\" ACTION=\"factsheet.php\">
Search:<br>
<select class=\"searchinput\" name=\"zoekterm\" size=\"1\" cols=\"50\">

<option value=\"Airbus\">Airbus</option>
</select>
<input type=\"submit\" class=\"button\" name=\"submit\" value=\"Fly\">


Ik werk nu met bovenstaande geval "zoekterm" wordt gestuurd naar factsheet.php waarin de select sql procedures staan.

In mijn vraag is de bedoeling dat het antwoord van het laatste selectbox het zoekwoord wordt.


alvast bedankt

Koosje schreef op 30.12.2007 18:11
Heeft iemand een idee hoe ik met het resultaat van bovenstaand script, weer kan zoeken in een ander sql database waarmee ik een content kan maken?

Rio-man schreef op 25.02.2008 19:38
Hoe kan ik opties toevoegen? Ik gebruik het drievoudige systeem.

zo ver ben ik al: www.scooterdatabase.nl/database/dropdown.php

nick schreef op 27.09.2008 10:48
Het is een mooi systeem, maar je moet jullie drop down menu eens testen met 15 000 gegevens ....

Kijk maar eens hoe snel het dan nog is :p

marc schreef op 01.10.2008 11:08
Hallo, ik heb volgend probleem. In een invulformuier moet de gebruiker diverse keuzes kunnen maken en velden invullen, waar ik vast zit is onderstaand

Volgende probleem stelt zich.

In een database 'afdelingen' staan verschillende records die uitgelezen worden en in een HTML selectielijst komen te staan.

$result = mysql_query("SELECT * FROM categorie WHERE cat_afd_naam ='$afd_naam'", $db) or die ("FOUT: " . mysql_error());
while (list($afd_id, $afd_naam) = mysql_fetch_row($result))
{
echo("<option value=\"$afd_naam\">$afd_naam</option>\n");
}

In een database 'categorie' staan verschillende records die momenteel ook
uitgelezen worden en in HTML selectielijst komen te staan.

$result = mysql_query("SELECT * FROM categorie ORDER BY at_afd_naam",
$db) or die ("FOUT: " . mysql_error());
while (list($cat_id, $cat_naam, $cat_afd_naam) = mysql_fetch_row($result))
{
echo("<option value=\"$cat_naam\">$cat_naam</option>\n");
}

Daar zit nu juist het probleem, bij het inladen van de pagina worden de selectielijst aangemaakt.

Eenmaal de gebruiker een afdeling gekozen heeft zou eigen in de
selectie lijst van de categorieen uiteindelijk de categorieen mogen staan die
bij de gekozen afdeling behoren.

En daar loop ik vast.

Hoe kan ik de selectie lijst pas aanvullen nadat de gebruiker een afdeling
koos?

Iemand die mij kan helpen.

Alvast bedankt

Martijn schreef op 05.12.2008 09:32
Het script is al oud, maar toch een reactie/vraag.

De 4-select en meer is wel leuk, alleen werkt dit niet als een 4-select.
Bij de 4de optie pakt hij niet optie 1-2-3 als criterium, maar alleen 2-3.
Iemand die dit heeft op weten te lossen zodat wel alle drie worden benut?

didier schreef op 22.12.2008 13:18
Hallo,
leuke scriptje maar heb wel klein probleem mee.

Als ik een derder select wil toevoegen, krijg ik dit bericht :
You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near 'Azur ' AND pays = 'FR' GROUP BY departement' at line 1

ik gebruik MySQL 5.0.51 en PHP 5

Deze script gaat niet meer als de 'surfer' javascript het uitgeschakeld. Bestaat er een script alleen in PHP??

dank u

Gewijzigd op 29.12.2008 18:12 door didier

didier schreef op 29.12.2008 18:13
Dit probleem is opgelost..

els schreef op 14.03.2009 22:35
Hallo, heeft er iemand misschien een database met alle automerken?

FoX schreef op 14.03.2009 23:14
Ik ga voor je kijken ik dacht ergen's op mijn pc 1tje te hebben...

any way poste het morgen als ik het gevonden heb

Tobias schreef op 08.10.2009 14:02
Super systeem. Ik zag hem idd staan op cartrack en dacht: die moet ik hebben voor mijn site. Bedankt!

Tobias schreef op 08.10.2009 20:13
Nog een vraagje:
Ik gebruik het 2-select-systeem.
Nu wil ik eigenlijk ook het aantal opties in de tweede dropdown weergeven als tekst in het formulier (eigenlijk aantal+1, maar dat lukt me nog wel)
Dus iets in de trend van
 Selecteer deze code
1
"Er zijn <?php echo $aantal; ?> resultaten gevonden"
, maar dan automatisch geupdate als ik een andere optie kies in dropdown 1.
Hoe kan ik dit het beste aanpakken?

Gewijzigd op 08.10.2009 20:28 door Tobias

An schreef op 11.12.2009 16:28
Mooi script, maar ik krijg het niet voor elkaar om na de (double) select ook de gevraagde selectie(output) te tonen? Hoe doe je dat nu?

Gewijzigd op 11.12.2009 17:50 door An

grancanaria schreef op 01.01.2010 20:26
Dit is een superscript! precies wat ik nodig had, echter loop ik tegen een ander probleem aan.

Ik wil een selectie schermpje maken voor een table met ongeveer 1500 producten, helaas loopt het script hierop vast.

Is dit script eventueel wat makkelijker te maken zodat ie wel werkt in mijn situatie?

shinger schreef op 06.02.2010 11:51
Hoe zeg ik dat ie dan de data moet laten zien dat gekoppeld is aan de 3de combobox?? ik heb in dit geval 3 tabellen middelste is een junction tabel dus multitable...

Voeg een reactie toe

Alleen leden mogen reacties toevoegen. Dit i.v.m. het vele spam die we de laatste tijd hebben gekregen. Je kunt je registreren op de registratie pagina. Ben je al lid? Dan kun je inloggen aan de bovenkant van de website.

Ga naar het overzicht met PHP scripts.
php hosting | faq | over ons | php tutorials | php scripts | php boeken | php links | php faq | php howto | forum | contact FlexServers
Wat snel webhosting

tracker Laatste PHP tutorials

10.02
Hoe kun je inloggen op PHPHul..
30.01
setlocale()
22.01
Uploadsysteem
19.01
Sleep
30.12
OOP Beginnershandleiding (PHP..

tracker Laatste PHP scripts

04.02
Veilige email adress weergave..
31.01
[UPDATE] Server Status v2
30.01
Pathfinding
30.01
Query script
30.01
Pagination Script

tracker Laatste PHP boeken

03.11
Basiscursus PHP 5
04.10
Object-Oriented Analysis & De..
04.05
Mysql 5 in 10 minuten
11.03
MySQL 5 Certification Study G..
03.08
PHP 5 in 10 minuten, 2e editi..

tracker Laatste forum berichten

13:24
PHPhulp Welkom terug op PHPHulp!
13:24
PHPhulp Welkom terug op PHPHulp!
13:24
PHPhulp Welkom terug op PHPHulp!
23:04
PHPhulp Bas, waarom kan ik niet m..
19:07
Bas, waarom kan ik niet meer ..
19:04
Hulp nodig: Script generator
14:41
menu is fout
14:06
Script met navigatie en filte..
14:06
[Jquery] Probleem met .html()..
13:41
normalisatie vraag
11:29
Javascript en php
10:15
Zoekfunctie met php

tracker Laatste reacties

13:27
Hoe kun je inlogge.. (PHP tutorial)
13:27
Hoe kun je inlogge.. (PHP tutorial)
13:27
Hoe kun je inlogge.. (PHP tutorial)
13:27
Hoe kun je inlogge.. (PHP tutorial)
13:27
Hoe kun je inlogge.. (PHP tutorial)
13:27
Hoe kun je inlogge.. (PHP tutorial)
13:27
Hoe kun je inlogge.. (PHP tutorial)
13:27
Hoe kun je inlogge.. (PHP tutorial)
13:27
Hoe kun je inlogge.. (PHP tutorial)
13:27
Hoe kun je inlogge.. (PHP tutorial)

PHP zoeken PHP zoeken

 Zoekterm

Zoeken in

tracker Voting poll

 Welke browser heeft jouw voorkeur?

Google Chrome
Mozilla Firefox
Internet Explorer
Apple Safari
Opera Software
Een andere browser


tracker Actieve leden

 
 Er zijn 41 gasten en 4 leden actief.
Actieve leden: peter-jan@blitz.nu, Arjen Halma, Marco, Wieland