2e dropdown vullen op basis van de 1e dropdown
Ik moet voor een website een dropdown vullen op basis van de geselecteerde waarde van de eerste dropdown op basis van PHP en MySQL. Nu heb ik in het verleden wel eens met deze talen gewerkt, maar kom er achter dat er de laatste tijd veel is veranderd.... :/
Nu heb ik al wat gevonden en getest. Het werkt en is een mooi beginpunt.
Het probleem waar ik nu tegen aanloop is het volgende:
Hoe kan ik aan 'huidig_id' meerdere waardes toekennen in de tabel 'isolatie_renovatie'?
Bij de eerste dropdown moet er bij de keus "geen isolatie", alle opties in de tweede dropdown worden weergegeven. Bij de andere keuzes moet exact dezelfde keuze in de tweede komen te staan.
Dus:
1e dropdown Geen isolatie -> alle 4 opties in 2e dropdown (Geen isolatie, Goede isolatie, Betere isolatie, Beste isolatie)
1e dropdown Goede isolatie -> 1 optie in 2e dropdown (Goede isolatie)
1e dropdown Betere isolatie -> 1 optie in 2e dropdown (Betere isolatie)
1e dropdown Beste isolatie -> 1 optie in 2e dropdown (Beste isolatie)
Bedankt voor het meedenken!
Dit heb ik zover:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
CREATE TABLE `isolatie_huidig` (
`huidig_id` int(11) NOT NULL,
`huidig_status` varchar(50) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8;
INSERT INTO `isolatie_huidig` (`huidig_id`, `huidig_status`) VALUES
(1, 'Geen isolatie'),
(2, 'Goede isolatie'),
(3, 'Betere isolatie'),
(4, 'Beste isolatie');
CREATE TABLE `isolatie_renovatie` (
`renovatie_id` int(11) NOT NULL,
`renovatie_status` varchar(50) NOT NULL,
`huidig_id` varchar(50) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8;
INSERT INTO `isolatie_renovatie` (`renovatie_id`, `renovatie_status`, `huidig_id`) VALUES
(1, 'Geen isolatie', '1'),
(2, 'Goede isolatie', '1'),
(3, 'Betere isolatie', '2'),
(4, 'Beste isolatie', '3');
`huidig_id` int(11) NOT NULL,
`huidig_status` varchar(50) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8;
INSERT INTO `isolatie_huidig` (`huidig_id`, `huidig_status`) VALUES
(1, 'Geen isolatie'),
(2, 'Goede isolatie'),
(3, 'Betere isolatie'),
(4, 'Beste isolatie');
CREATE TABLE `isolatie_renovatie` (
`renovatie_id` int(11) NOT NULL,
`renovatie_status` varchar(50) NOT NULL,
`huidig_id` varchar(50) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8;
INSERT INTO `isolatie_renovatie` (`renovatie_id`, `renovatie_status`, `huidig_id`) VALUES
(1, 'Geen isolatie', '1'),
(2, 'Goede isolatie', '1'),
(3, 'Betere isolatie', '2'),
(4, 'Beste isolatie', '3');
index.php
Code (php)
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
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
<html>
<head>
<title>Test</title>
</head>
<body>
<div>
<label>Isolatie :</label><select name="isolatie_huidig" class="isolatie_huidig">
<option value="0">Selecteer isolatie</option>
<?php
include('db.php');
$sql = mysqli_query($con,"select * from isolatie_huidig");
while($row=mysqli_fetch_array($sql))
{
echo '<option value="'.$row['huidig_id'].'">'.$row['huidig_status'].'</option>';
} ?>
</select><br/><br/>
<label>City :</label><select name="isolatie_renovatie" class="isolatie_renovatie">
<option>Select City</option>
</select>
<br /><br />
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$(".isolatie_huidig").change(function()
{
var huidig_id=$(this).val();
var post_id = 'id='+ huidig_id;
$.ajax
({
type: "POST",
url: "ajax.php",
data: post_id,
cache: false,
success: function(cities)
{
$(".isolatie_renovatie").html(cities);
}
});
});
});
</script>
</body>
</html>
<head>
<title>Test</title>
</head>
<body>
<div>
<label>Isolatie :</label><select name="isolatie_huidig" class="isolatie_huidig">
<option value="0">Selecteer isolatie</option>
<?php
include('db.php');
$sql = mysqli_query($con,"select * from isolatie_huidig");
while($row=mysqli_fetch_array($sql))
{
echo '<option value="'.$row['huidig_id'].'">'.$row['huidig_status'].'</option>';
} ?>
</select><br/><br/>
<label>City :</label><select name="isolatie_renovatie" class="isolatie_renovatie">
<option>Select City</option>
</select>
<br /><br />
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$(".isolatie_huidig").change(function()
{
var huidig_id=$(this).val();
var post_id = 'id='+ huidig_id;
$.ajax
({
type: "POST",
url: "ajax.php",
data: post_id,
cache: false,
success: function(cities)
{
$(".isolatie_renovatie").html(cities);
}
});
});
});
</script>
</body>
</html>
ajax.php
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
2
3
4
5
6
7
8
9
10
11
12
13
include('db.php');
if($_POST['id']){
$id=$_POST['id'];
if($id==0){
echo "<option>Selecteer isolatie</option>";
}else{
$sql = mysqli_query($con,"SELECT * FROM `isolatie_renovatie` WHERE huidig_id='$id'");
while($row = mysqli_fetch_array($sql)){
echo '<option value="'.$row['renovatie_id'].'">'.$row['renovatie_status'].'</option>';
}
}
}
?>
if($_POST['id']){
$id=$_POST['id'];
if($id==0){
echo "<option>Selecteer isolatie</option>";
}else{
$sql = mysqli_query($con,"SELECT * FROM `isolatie_renovatie` WHERE huidig_id='$id'");
while($row = mysqli_fetch_array($sql)){
echo '<option value="'.$row['renovatie_id'].'">'.$row['renovatie_status'].'</option>';
}
}
}
?>
Gewijzigd op 23/07/2020 00:20:36 door Roy B
Code (php)
1
2
3
4
5
2
3
4
5
if ( $id == 1 ) {
$sql = 'SELECT * FROM isolatie_renovatie';
} else {
$sql = 'SELECT * FROM isolatie_renovatie WHERE huidig_id = "' . $id . '"';
}
$sql = 'SELECT * FROM isolatie_renovatie';
} else {
$sql = 'SELECT * FROM isolatie_renovatie WHERE huidig_id = "' . $id . '"';
}
Je moet in tabellen isolatie_renovatie en isolatie_huidig column huidid_id in de pas laten lopen, anders krijg je de eerst volgende keuze.
Gewijzigd op 23/07/2020 11:55:52 door Adoptive Solution
Let er wel op dat er SQL-injection mogelijk is in je query!!!!
Je zou ook kunnen volstaan met twee identieke dropdowns die beide gewoon hun informatie halen uit de isolatie_huidig-tabel (en deze zou je voor de goede orde misschien simpelweg 'isolatie_niveaus' kunnen noemen o.i.d.).
Ik zie niet direct het nut van een tweede tabel (isolatie_renovatie) die nagenoeg dezelfde informatie bevat, met uitzondering van een soort van minimaal verband tussen de isolatie-niveaus. Maar die "regels" kun je ook op een andere manier vangen/afdwingen.
Op het moment dat je de formuliergegevens verwerkt zou je dit alles nog steeds moeten valideren. Daar zou je dan dus kunnen controleren of het nieuwe isolatie niveau ten minste gelijk is aan het oude? Of indien er al sprake was van isolatie, dat het nieuwe niveau hoger moet zijn, of wat je maar wilt dat er moet gelden. In dit geval zijn er verschillende manieren om hetzelfde te bereiken.
Dat is idd een optie. Ga ik testen. Dank je voor de reactie!
@-Ariën-
Gaan we nog mee aan de slag als het werkt. Dank je voor de reactie!
@Thomas van den Heuvel
Ben niet zo ervaren met PHP en MySQL dus ik probeer het een beetje uit. En dit werkte voor zover al zie ik nog zeker ruimte voor verbeteringen. :)
Ik zat ook aan 1 tabel te denken, maar was er nog niet uit hoe ik dat voor elkaar moet krijgen. Dank je voor de reacie!
Toevoeging op 24/07/2020 13:48:13:
Adoptive Solution op 23/07/2020 11:55:20:
Je kan bij keuze $id=1 alles opvragen.
Je moet in tabellen isolatie_renovatie en isolatie_huidig column huidid_id in de pas laten lopen, anders krijg je de eerst volgende keuze.
Code (php)
1
2
3
4
5
2
3
4
5
if ( $id == 1 ) {
$sql = 'SELECT * FROM isolatie_renovatie';
} else {
$sql = 'SELECT * FROM isolatie_renovatie WHERE huidig_id = "' . $id . '"';
}
$sql = 'SELECT * FROM isolatie_renovatie';
} else {
$sql = 'SELECT * FROM isolatie_renovatie WHERE huidig_id = "' . $id . '"';
}
Je moet in tabellen isolatie_renovatie en isolatie_huidig column huidid_id in de pas laten lopen, anders krijg je de eerst volgende keuze.
Hoe kan ik dit in ajax.php plaatsen? Heb al wat dingen geprobeerd maar kom er niet uit.
Code (php)
1
2
3
4
5
6
2
3
4
5
6
if ( $id == 1 )
{
$sql = mysqli_query($con,"SELECT * FROM `isolatie_renovatie`");
} else {
$sql = mysqli_query($con,"SELECT * FROM `isolatie_renovatie` WHERE huidig_id='$id'");
}
{
$sql = mysqli_query($con,"SELECT * FROM `isolatie_renovatie`");
} else {
$sql = mysqli_query($con,"SELECT * FROM `isolatie_renovatie` WHERE huidig_id='$id'");
}
Gewijzigd op 24/07/2020 14:03:35 door Adoptive Solution
Adoptive Solution op 24/07/2020 14:02:35:
Onderstaande heb ik geprobeerd maar 2e dropdown pakt het niet op. Volgens mij is dat exact wat je aangeeft.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<?php
include('db.php');
if($_POST['id']){
$id=$_POST['id'];
if($id==0){
echo "<option>Selecteer isolatie</option>";
}else{
//$sql = mysqli_query($con,"SELECT * FROM 'isolatie_renovatie' WHERE huidig_id='$id'");
if ( $id == 1 )
{
$sql = mysqli_query($con,"SELECT * FROM `isolatie_renovatie`");
} else {
$sql = mysqli_query($con,"SELECT * FROM `isolatie_renovatie` WHERE huidig_id='$id'");
}
while($row = mysqli_fetch_array($sql)){
echo '<option value="'.$row['renovatie_id'].'">'.$row['renovatie_status'].'</option>';
}
}
}
?>
include('db.php');
if($_POST['id']){
$id=$_POST['id'];
if($id==0){
echo "<option>Selecteer isolatie</option>";
}else{
//$sql = mysqli_query($con,"SELECT * FROM 'isolatie_renovatie' WHERE huidig_id='$id'");
if ( $id == 1 )
{
$sql = mysqli_query($con,"SELECT * FROM `isolatie_renovatie`");
} else {
$sql = mysqli_query($con,"SELECT * FROM `isolatie_renovatie` WHERE huidig_id='$id'");
}
while($row = mysqli_fetch_array($sql)){
echo '<option value="'.$row['renovatie_id'].'">'.$row['renovatie_status'].'</option>';
}
}
}
?>
Nu blijft het gokken.
Gewijzigd op 24/07/2020 14:31:59 door Ramon van Dongen
Ramon van Dongen op 24/07/2020 14:31:38:
Ik zou even kijken met bijvoorbeeld var_dump($_POST) in je ajax-php bestand wat er precies doorgegeven wordt in $_POST
Nu blijft het gokken.
Nu blijft het gokken.
Als ik ajax.php direct aanroep dan geeft de dump: array(0) { }
Maar als je in je ajax.php bestand ergens bovenin var_dump($_POST); zet, wat gebeurt er dan zodra je de eerste selectbox wijzigt?
Ik vind het zelf altijd handiger om met ajax de gehele 2de selectbox te creëeren (in jouw geval dus in je ajax.php bestand), dus inclusief de <select> en </select> en niet alleen de <option>'s
Als ik de index open dan zie ik niets, open ik de ajax.php dan zie ik
Notice: Undefined index: id in demo/ajax.php on line 4
Hier gaat in ieder geval dus iets fout.
Probeer in je index.php dit:eens aan te passen naar
Wat gebeurt er dan?
Dan blijft de melding hetzelfde op ajax.php
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
$(".isolatie_huidig").change(function(){
alert($(".isolatie_huidig").children("option:selected").val());
$.ajax({
type: "POST",
url: "ajax.php",
data: { "id": $(".isolatie_huidig").children("option:selected").val()},
cache: false,
success: function(cities){
$(".isolatie_renovatie").html(cities);
}
});
});
alert($(".isolatie_huidig").children("option:selected").val());
$.ajax({
type: "POST",
url: "ajax.php",
data: { "id": $(".isolatie_huidig").children("option:selected").val()},
cache: false,
success: function(cities){
$(".isolatie_renovatie").html(cities);
}
});
});
Niet getest hoor dus misschien dat het niet klopt, maar zoiets zou ik eens proberen. Met de alert even testen of er überhaupt wel iets door komt aan id.
Gewijzigd op 24/07/2020 15:07:33 door Ramon van Dongen
index
Code (php)
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
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
<html>
<head>
<title>Test</title>
</head>
<body>
<div>
<label>Isolatie huidig :</label>
<select name="isolatie" class="isolatie">
<option value="0">Selecteer isolatie</option>
<?php
include('db.php');
$sql = mysqli_query($con,"select * from isolatie");
while($row=mysqli_fetch_array($sql))
{
echo '<option value="'.$row['id'].'">'.$row['status'].'</option>';
}
?>
</select>
<br/><br/>
<label>Isolatie na renovatie</label>
<select name="isolatie_renovatie" class="isolatie_renovatie">
<option>Selecteer isolatie</option>
</select>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$(".isolatie").change(function()
{
var id=$(this).val();
var post_id = 'id='+ id;
$.ajax
({
type: "POST",
url: "ajax1.php",
data: post_id,
cache: false,
success: function(isolatie)
{
$(".isolatie_renovatie").html(isolatie);
}
});
});
});
</script>
</body>
</html>
<head>
<title>Test</title>
</head>
<body>
<div>
<label>Isolatie huidig :</label>
<select name="isolatie" class="isolatie">
<option value="0">Selecteer isolatie</option>
<?php
include('db.php');
$sql = mysqli_query($con,"select * from isolatie");
while($row=mysqli_fetch_array($sql))
{
echo '<option value="'.$row['id'].'">'.$row['status'].'</option>';
}
?>
</select>
<br/><br/>
<label>Isolatie na renovatie</label>
<select name="isolatie_renovatie" class="isolatie_renovatie">
<option>Selecteer isolatie</option>
</select>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$(".isolatie").change(function()
{
var id=$(this).val();
var post_id = 'id='+ id;
$.ajax
({
type: "POST",
url: "ajax1.php",
data: post_id,
cache: false,
success: function(isolatie)
{
$(".isolatie_renovatie").html(isolatie);
}
});
});
});
</script>
</body>
</html>
ajax
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<?php
include('db.php');
if($_POST['id']){
$id=$_POST['id'];
if($id==0){
echo "<option>Selecteer isolatie</option>";
}else{
$sql = mysqli_query($con,"SELECT * FROM `isolatie` WHERE
(SELECT `alle_opties` FROM `isolatie` WHERE `id` = $id) = 1 or `id`= $id");
while($row = mysqli_fetch_array($sql)){
echo '<option value="'.$row['id'].'">'.$row['status'].'</option>';
}
}
}
?>
include('db.php');
if($_POST['id']){
$id=$_POST['id'];
if($id==0){
echo "<option>Selecteer isolatie</option>";
}else{
$sql = mysqli_query($con,"SELECT * FROM `isolatie` WHERE
(SELECT `alle_opties` FROM `isolatie` WHERE `id` = $id) = 1 or `id`= $id");
while($row = mysqli_fetch_array($sql)){
echo '<option value="'.$row['id'].'">'.$row['status'].'</option>';
}
}
}
?>
Toevoeging op 24/07/2020 16:14:31:
Ramon van Dongen op 24/07/2020 14:43:36:
Ik vind het zelf altijd handiger om met ajax de gehele 2de selectbox te creëeren (in jouw geval dus in je ajax.php bestand), dus inclusief de <select> en </select> en niet alleen de <option>'s
Heb ik mee zitten proberen, maar is me niet gelukt om het goed werkend te krijgen.
Gewijzigd op 24/07/2020 15:20:52 door Roy B
De dropdowns werken zoals het hoort. Nu heb ik aan de tabel nog een waarde toegevoegd, de indexwaarde. Elke isolatiestatus heeft een indexwaarde. Deze indexwaarde wil ik gebruiken om de isolatie waarde te berekenen.
Stel dat de isolatie waarde 3,0 is bij geen isolatie.
Geen isolatie heeft indexwaarde van 0,0 -> isolatiewaarde = 3,0 - 0,0
Goede isolatie heeft indexwaarde van 0,5 -> isolatiewaarde = 3,0 - 0,5
Betere isolatie heeft indexwaarde van 0,7 -> isolatiewaarde = 3,0 - 0,7
Beste isolatie heeft indexwaarde van 0,9 -> isolatiewaarde = 3,0 - 0,9
De (nieuwe) isolatiewaarde wil ik weergeven op de pagina.
Deze indexwaarde moet dan uit de 2e dropdown komen en daar loop ik op vast. De indexwaarde weergegeven in de dropdown is geen probleem, maar nu deze waarde nog uitlezen uit deze dropdown zodat ik deze kan gebruiken om de nieuwe isolatiewaarde te berekenen.
Iemand die me op weg kan helpen hiermee?
Alvast bedankt.
Gewijzigd op 30/07/2020 01:14:17 door Roy B
https://stackoverflow.com/questions/1085801/get-selected-value-in-dropdown-list-using-javascript
Eigenlijk op dezelfde manier zoals je de waarde in menu 1 leest om menu 2 te vullen.
Toevoeging op 30/07/2020 10:24:20:
En hier de werkende voorbeelden
https://freakyjolly.com/demo/getDropDownValue_JavaScript_jQuery.html
Ik heb wat geprobeerd en heb het nu half aan het werk met onderstaande
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
2
3
4
5
6
7
8
9
10
11
12
13
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(function(){
$("#singleSelectValueDDjQuery").on("change",function(){
//Getting Value
var selValue = $("#singleSelectValueDDjQuery").val();
//Setting Value
$("#textFieldValueJQ").val(selValue);
});
});
</script>
<script>
$(function(){
$("#singleSelectValueDDjQuery").on("change",function(){
//Getting Value
var selValue = $("#singleSelectValueDDjQuery").val();
//Setting Value
$("#textFieldValueJQ").val(selValue);
});
});
</script>
Code (php)
1
2
3
4
2
3
4
<label>Isolatie na renovatie</label>
<select name="isolatie_renovatie" class="isolatie_renovatie" id="singleSelectValueDDjQuery">
<option>Selecteer isolatie</option>
</select>
<select name="isolatie_renovatie" class="isolatie_renovatie" id="singleSelectValueDDjQuery">
<option>Selecteer isolatie</option>
</select>
Als ik in de 1e dropdown "geen isolatie" kies dan krijg ik in de 2e dropdown 4 opties.
Standaard staat deze op "geen isolatie | 0,00". De waarde 0,00 komt niet standaard in het textveldje te staan. Verander ik het naar 1 van de 3 andere dan komt die waarde wel erin te staan. Verander ik het weer naar "geen isolatie | 0,00" dan komt er wel netjes 0,00 in het textveld te staan.
Kies ik in de 1e dropdown een andere waarde, dan veranderd de 2e dropdown netjes mee. De waarde ervan komt niet in het textveld.
Dus de standaardwaarde die in de 2e dropdown komt wordt niet gelezen. Pas als daar een verandering is dan wordt het in het textveld gezet.
Niemand die me op weg kan helpen? :'(
De werking van de 2 menuus is bekend.
isolatie.php vult het eerste menu.
Aanvullend wordt isolatie_calc.php aangeroepen om iets uit te rekenen/op te halen.
Ik heb maar iets verzonnen.
Het resultaat wordt in id='resultaat' getoond.
Code (php)
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
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
<div>
<label>Isolatie :</label>
<select id="isolatie_huidig" name="isolatie_huidig" class="isolatie_huidig">
<option value="10000">Selecteer isolatie</option>
<?php
include('connect.php');
$result = $db->query("SELECT * FROM isolatie_huidig");
while ( $row = $result->fetch_object() )
{
echo '<option value="' . $row->huidig_id . '">' . $row->huidig_status . '</option>' . PHP_EOL;
}
?>
</select>
<br /><br />
<label>City :</label>
<select id="isolatie_renovatie" name="isolatie_renovatie" class="isolatie_renovatie" >
<option>Select City</option>
</select>
<br /><br />
<p id="resultaat"></p>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function()
{
$("#isolatie_huidig").change(function()
{
var huidig_id = $(this).val();
var post_id = 'id='+ huidig_id;
$.ajax ({
type: "POST",
url: "isolatie.php",
data: post_id,
cache: false,
success: function(isolatie)
{
$("#isolatie_renovatie").html(isolatie);
singleSelectChangeValue();
getCalcValues( post_id );
}
});
});
});
$("#isolatie_renovatie").change(function()
{
var huidig_id = $(this).val();
var post_id = 'id='+ huidig_id;
getCalcValues( post_id );
});
function getCalcValues( theId )
{
$.ajax ({
type: "POST",
url: "isolatie_calc.php",
data: theId,
cache: false,
success: function(resultaat)
{
$("#resultaat").html(resultaat);
}
});
}
function singleSelectChangeValue()
{
var selObj = document.getElementById("isolatie_renovatie");
var selValue = selObj.options[selObj.selectedIndex].value;
var selText = selObj.options[selObj.selectedIndex].text;
}
</script>
<label>Isolatie :</label>
<select id="isolatie_huidig" name="isolatie_huidig" class="isolatie_huidig">
<option value="10000">Selecteer isolatie</option>
<?php
include('connect.php');
$result = $db->query("SELECT * FROM isolatie_huidig");
while ( $row = $result->fetch_object() )
{
echo '<option value="' . $row->huidig_id . '">' . $row->huidig_status . '</option>' . PHP_EOL;
}
?>
</select>
<br /><br />
<label>City :</label>
<select id="isolatie_renovatie" name="isolatie_renovatie" class="isolatie_renovatie" >
<option>Select City</option>
</select>
<br /><br />
<p id="resultaat"></p>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function()
{
$("#isolatie_huidig").change(function()
{
var huidig_id = $(this).val();
var post_id = 'id='+ huidig_id;
$.ajax ({
type: "POST",
url: "isolatie.php",
data: post_id,
cache: false,
success: function(isolatie)
{
$("#isolatie_renovatie").html(isolatie);
singleSelectChangeValue();
getCalcValues( post_id );
}
});
});
});
$("#isolatie_renovatie").change(function()
{
var huidig_id = $(this).val();
var post_id = 'id='+ huidig_id;
getCalcValues( post_id );
});
function getCalcValues( theId )
{
$.ajax ({
type: "POST",
url: "isolatie_calc.php",
data: theId,
cache: false,
success: function(resultaat)
{
$("#resultaat").html(resultaat);
}
});
}
function singleSelectChangeValue()
{
var selObj = document.getElementById("isolatie_renovatie");
var selValue = selObj.options[selObj.selectedIndex].value;
var selText = selObj.options[selObj.selectedIndex].text;
}
</script>
Dit is "isolatie.php".
Code (php)
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
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<?php
include('connect.php');
if( $_POST['id'] )
{
$id = $_POST['id'];
$options = '';
if ( $id <= 9999 )
{
if ( $id == 1 )
{
$query = 'SELECT * FROM isolatie_renovatie';
} else {
$query = 'SELECT * FROM isolatie_renovatie WHERE huidig_id = "' . $id . '"';
}
$result = $db->query( $query );
while( $row = $result->fetch_object() )
{
$options .= '<option value="' . $row->renovatie_id . '">' . $row->renovatie_status . '</option>' . PHP_EOL;
}
} else {
$options .= '<option value="0">Selecteer eerst isolatie</option>' . PHP_EOL;
}
echo $options;
}
?>
include('connect.php');
if( $_POST['id'] )
{
$id = $_POST['id'];
$options = '';
if ( $id <= 9999 )
{
if ( $id == 1 )
{
$query = 'SELECT * FROM isolatie_renovatie';
} else {
$query = 'SELECT * FROM isolatie_renovatie WHERE huidig_id = "' . $id . '"';
}
$result = $db->query( $query );
while( $row = $result->fetch_object() )
{
$options .= '<option value="' . $row->renovatie_id . '">' . $row->renovatie_status . '</option>' . PHP_EOL;
}
} else {
$options .= '<option value="0">Selecteer eerst isolatie</option>' . PHP_EOL;
}
echo $options;
}
?>
Dit is "isolatie_calc.php" die iets uit een 3de , verzonnen, tabel haalt.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
2
3
4
5
6
7
8
9
10
11
12
13
14
En om zelf te proberen, de SQL data
Code (php)
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
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
-- Adminer 4.7.6 MySQL dump
SET NAMES utf8;
SET time_zone = '+00:00';
SET foreign_key_checks = 0;
SET sql_mode = 'NO_AUTO_VALUE_ON_ZERO';
SET NAMES utf8mb4;
DROP TABLE IF EXISTS `isolatie_help`;
CREATE TABLE `isolatie_help` (
`huidig_help_id` int(11) NOT NULL,
`huidig_help_uitleg` varchar(50) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
INSERT INTO `isolatie_help` (`huidig_help_id`, `huidig_help_uitleg`) VALUES
(1, 'Geen isolatie nodig'),
(2, 'Goede isolatie scheelt een hoop'),
(3, 'Betere isolatie bespaart geld'),
(4, 'Beste isolatie redt de planeet');
DROP TABLE IF EXISTS `isolatie_huidig`;
CREATE TABLE `isolatie_huidig` (
`huidig_id` int(11) NOT NULL,
`huidig_status` varchar(50) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
INSERT INTO `isolatie_huidig` (`huidig_id`, `huidig_status`) VALUES
(1, 'Geen isolatie'),
(2, 'Goede isolatie'),
(3, 'Betere isolatie'),
(4, 'Beste isolatie');
DROP TABLE IF EXISTS `isolatie_renovatie`;
CREATE TABLE `isolatie_renovatie` (
`renovatie_id` int(11) NOT NULL,
`renovatie_status` varchar(50) NOT NULL,
`huidig_id` varchar(50) NOT NULL,
`indexwaarde` varchar(50) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
INSERT INTO `isolatie_renovatie` (`renovatie_id`, `renovatie_status`, `huidig_id`, `indexwaarde`) VALUES
(1, 'Geen isolatie', '1', '0.0'),
(2, 'Goede isolatie', '2', '0.5'),
(3, 'Betere isolatie', '3', '0.7'),
(4, 'Beste isolatie', '4', '0.9');
-- 2020-08-01 10:03:26
SET NAMES utf8;
SET time_zone = '+00:00';
SET foreign_key_checks = 0;
SET sql_mode = 'NO_AUTO_VALUE_ON_ZERO';
SET NAMES utf8mb4;
DROP TABLE IF EXISTS `isolatie_help`;
CREATE TABLE `isolatie_help` (
`huidig_help_id` int(11) NOT NULL,
`huidig_help_uitleg` varchar(50) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
INSERT INTO `isolatie_help` (`huidig_help_id`, `huidig_help_uitleg`) VALUES
(1, 'Geen isolatie nodig'),
(2, 'Goede isolatie scheelt een hoop'),
(3, 'Betere isolatie bespaart geld'),
(4, 'Beste isolatie redt de planeet');
DROP TABLE IF EXISTS `isolatie_huidig`;
CREATE TABLE `isolatie_huidig` (
`huidig_id` int(11) NOT NULL,
`huidig_status` varchar(50) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
INSERT INTO `isolatie_huidig` (`huidig_id`, `huidig_status`) VALUES
(1, 'Geen isolatie'),
(2, 'Goede isolatie'),
(3, 'Betere isolatie'),
(4, 'Beste isolatie');
DROP TABLE IF EXISTS `isolatie_renovatie`;
CREATE TABLE `isolatie_renovatie` (
`renovatie_id` int(11) NOT NULL,
`renovatie_status` varchar(50) NOT NULL,
`huidig_id` varchar(50) NOT NULL,
`indexwaarde` varchar(50) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
INSERT INTO `isolatie_renovatie` (`renovatie_id`, `renovatie_status`, `huidig_id`, `indexwaarde`) VALUES
(1, 'Geen isolatie', '1', '0.0'),
(2, 'Goede isolatie', '2', '0.5'),
(3, 'Betere isolatie', '3', '0.7'),
(4, 'Beste isolatie', '4', '0.9');
-- 2020-08-01 10:03:26
Succes. En als het misloopt, ik ontken alles.
Ik ga er dit weekend mee aan de slag en laat je dan weten of het gelukt is!