Wachten tot tag dialog gesloten is
Ik heb een dialog tag met een vraag voor de gebruiker. Echter na maken loopt de code gewoon door terwijl ik eerst het antwoord moet hebben.
Ik heb geprobeerd met
[ul]
er een los in te steken==> computer hangt in de los
een wait commando. ==> wait is not defined
[/ul]
Hoe kan ik dit laten wachten?
Jan
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
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
function myConfirm(head, txt, knoppen) {
let d = document.getElementById("dlgAsk1");
let h = document.querySelector("#dlgAsk1 .header");
let t = document.querySelector("#dlgAsk1 .text");
let dknoppen = document.querySelector("#dlgAsk1 .knoppen");
t.innerText = txt;
h.innerText = head;
for(let i=0;i<knoppen.length;i++) {
let k = document.createElement("input");
k.type="button";
k.visible=true;
k.value=knoppen[i];
k.onclick = function() {
sluit(this.closest('dialog'), this.value);
myConfirm.terug=this.value;
}
dknoppen.appendChild(k);
}
d.showModal();
let a=0;
do {
//wait(500);
a+=1;
} while(d.open)
return myConfirm.terug;
}
function sluit(d, buttonTxt) {
d.close();
return buttonTxt;
}
let d = document.getElementById("dlgAsk1");
let h = document.querySelector("#dlgAsk1 .header");
let t = document.querySelector("#dlgAsk1 .text");
let dknoppen = document.querySelector("#dlgAsk1 .knoppen");
t.innerText = txt;
h.innerText = head;
for(let i=0;i<knoppen.length;i++) {
let k = document.createElement("input");
k.type="button";
k.visible=true;
k.value=knoppen[i];
k.onclick = function() {
sluit(this.closest('dialog'), this.value);
myConfirm.terug=this.value;
}
dknoppen.appendChild(k);
}
d.showModal();
let a=0;
do {
//wait(500);
a+=1;
} while(d.open)
return myConfirm.terug;
}
function sluit(d, buttonTxt) {
d.close();
return buttonTxt;
}
Code (php)
1
2
3
4
5
6
2
3
4
5
6
<dialog class="p50X30" id="dlgAsk1">
<h1 class="header"> </h1>
<div class="text"> </div>
<div class="knoppen"> </div>
<div class="voet"> </div>
</dialog>
<h1 class="header"> </h1>
<div class="text"> </div>
<div class="knoppen"> </div>
<div class="voet"> </div>
</dialog>
https://developer.mozilla.org/en-US/docs/Web/API/HTMLDialogElement/showModal
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
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
<!DOCTYPE html>
<html>
<head>
<title>PHPHulp</title>
</head>
<body>
<dialog id="favDialog">
<form method="dialog">
<p>
<label for="favAnimal">Favorite animal:</label>
<select id="favAnimal" name="favAnimal">
<option></option>
<option>Brine shrimp</option>
<option>Red panda</option>
<option>Spider monkey</option>
</select>
</p>
<div>
<button id="cancel" type="reset">Cancel</button>
<button type="submit">Confirm</button>
</div>
</form>
</dialog>
<div>
<button id="updateDetails">Update details</button>
</div>
<script>
const updateButton = document.getElementById("updateDetails");
const cancelButton = document.getElementById("cancel");
const dialog = document.getElementById("favDialog");
const animal = document.getElementById("favAnimal");
dialog.returnValue = "hier je default-waarde";
updateButton.addEventListener("click", () => {
dialog.showModal();
});
cancelButton.addEventListener("click", () => {
dialog.close("animalNotChosen");
});
dialog.addEventListener('close', () => {
dialog.returnValue = animal.value;
console.log('Dialog was closed. Value chosen: ' + dialog.returnValue);
});
</script>
</body>
</html>
<html>
<head>
<title>PHPHulp</title>
</head>
<body>
<dialog id="favDialog">
<form method="dialog">
<p>
<label for="favAnimal">Favorite animal:</label>
<select id="favAnimal" name="favAnimal">
<option></option>
<option>Brine shrimp</option>
<option>Red panda</option>
<option>Spider monkey</option>
</select>
</p>
<div>
<button id="cancel" type="reset">Cancel</button>
<button type="submit">Confirm</button>
</div>
</form>
</dialog>
<div>
<button id="updateDetails">Update details</button>
</div>
<script>
const updateButton = document.getElementById("updateDetails");
const cancelButton = document.getElementById("cancel");
const dialog = document.getElementById("favDialog");
const animal = document.getElementById("favAnimal");
dialog.returnValue = "hier je default-waarde";
updateButton.addEventListener("click", () => {
dialog.showModal();
});
cancelButton.addEventListener("click", () => {
dialog.close("animalNotChosen");
});
dialog.addEventListener('close', () => {
dialog.returnValue = animal.value;
console.log('Dialog was closed. Value chosen: ' + dialog.returnValue);
});
</script>
</body>
</html>
Gewijzigd op 16/04/2023 08:42:47 door Jan Koehoorn
Een wait zou voor mij handiger zijn :)
Bedankt allen