[Javascript] voor dummies deel 5

zaterdag 31 maart 2007 @ 23:24:35 #121

qu63

..de tijd drinkt..

Stukje HTML:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

<form action="javascript:get(document.getElementById('myform'),1);" name="myform1" id="myform1">
<textarea id="mytextarea11">my test
1
2
3
</textarea>
<textarea id="mytextarea12">my test2
4
5
6</textarea>
<br>
<input type="button" name="button" value="Submit"
onclick="javascript:get(this.parentNode,1);">
</form>
<br><br>
Server-Response:<br>
<hr>
<span name="myspan1" id="myspan1">hoi?</span>

Werkende JavaScript:

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

Niet werkende JavaScript:

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

enige wijzigingen zitten in de regeles 24, 33, 38, 45 ,47 en 51..

iemand tips? :)

It's Time To Shine
[i]What would life be like without rhethorical questions?[/i]

zondag 1 april 2007 @ 10:41:21 #122

SuperRembo

Sinds 1998

onreadystatechange moet een functie zijn die uitgevoer kan worden als de readystate van de request veranderd. In de oude versie is het inderdaad een functie, in de nieuwe versie wordt de functie alertContents meteen uitgevoerd en het resultaat (null/undefinded) wordt aan onreadystatechange toegekend.

Extra parameters doorgeven kan met behulp van een closure:

1
2
3

http_request.onreadystatechange = function() {
alertContents(nr);
}

Als je toch alle gegevens via javascript wil ophalen en de form submit niet gebruikt, dan kan je beter de hele form tag weg laten.
In een onclick attribuut hoort javascript te staan, dus "javascript:" is daar overbodig.
Ik zou de sluit-knop gewoon in je html zetten. Standaard is ie verborgen, alleen als je 'm nodig hebt maak je 'm zichtbaar. Dat werkt een stuk makkelijker dan in javascript een hele button in innerHTML zetten. Hetzelfde geldt voor het 'busy' plaatje.

zondag 1 april 2007 @ 15:13:46 #123

qu63

..de tijd drinkt..

quote:
Op zondag 1 april 2007 10:41 schreef SuperRembo het volgende:
onreadystatechange moet een functie zijn die uitgevoer kan worden als de readystate van de request veranderd. In de oude versie is het inderdaad een functie, in de nieuwe versie wordt de functie alertContents meteen uitgevoerd en het resultaat (null/undefinded) wordt aan onreadystatechange toegekend.

Extra parameters doorgeven kan met behulp van een closure:

[ code verwijderd ]

check! :)

quote:
Als je toch alle gegevens via javascript wil ophalen en de form submit niet gebruikt, dan kan je beter de hele form tag weg laten.

hoe bedoel je dat? Het is de bedoeling dat er meerdere 'forms' komen (zoals dit dus-->)
HTML

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

<form action="javascript:get(document.getElementById('myform'),1);" name="myform1" id="myform1">
<input id="mytextarea11" value="my test">
<input id="mytextarea12" value="my test">
<input type="button" name="button" value="Submit"
onclick="javascript:get(this.parentNode,1);">
</form>
<div id="myspan1"></div>
meteen wat tekst?
<form action="javascript:get(document.getElementById('myform'),2);" name="myform2" id="myform2">
<input id="mytextarea21" value="my test">
<input id="mytextarea22" value="my test">
<input type="button" name="button" value="Submit"
onclick="javascript:get(this.parentNode,2);">
</form>
<div id="myspan2"></div>
meteen wat tekst?

quote:
In een onclick attribuut hoort javascript te staan, dus "javascript:" is daar overbodig.
Ik zou de sluit-knop gewoon in je html zetten. Standaard is ie verborgen, alleen als je 'm nodig hebt maak je 'm zichtbaar. Dat werkt een stuk makkelijker dan in javascript een hele button in innerHTML zetten. Hetzelfde geldt voor het 'busy' plaatje.

je bedoelt dmv style="display:none"?

It's Time To Shine
[i]What would life be like without rhethorical questions?[/i]

zondag 1 april 2007 @ 15:59:58 #124

SuperRembo

Sinds 1998

quote:
Op zondag 1 april 2007 15:13 schreef qu63 het volgende:
hoe bedoel je dat? Het is de bedoeling dat er meerdere 'forms' komen (zoals dit dus-->)
HTML

De action van het form doet hetzelfde als de onclick van de submit button. Ik vraag me af of die action überhaupt uitgevoerd wordt.

quote:
je bedoelt dmv style="display:none"?

Ja.

zondag 1 april 2007 @ 16:25:05 #125

qu63

..de tijd drinkt..

quote:
Op zondag 1 april 2007 15:59 schreef SuperRembo het volgende:

[..]

De action van het form doet hetzelfde als de onclick van de submit button. Ik vraag me af of die action überhaupt uitgevoerd wordt.

wordt idd niet uitgevoerd..

It's Time To Shine
[i]What would life be like without rhethorical questions?[/i]

zondag 1 april 2007 @ 19:13:19 #126

cyberstalker

Een krachtig neen!

quote:
Op zondag 1 april 2007 16:25 schreef qu63 het volgende:

[..]

wordt idd niet uitgevoerd..

Maar is wel nodig voor de validatie van je document. Als dat je uberhaupt iets uitmaakt.

Hope for the best, prepare for the worst.

dinsdag 3 april 2007 @ 15:52:35 #127

SlimShady

stel voor je hebt tables met bepaalde eigenschappen nodig. en je verzamelt ze in een array.
dan wordt de verwijzing naar het element opgeslagen toch?

wat ik wil doen is het volgende:
- het origineel kopiÃ«ren en bewaren in de array, dmv cloneNode (om later terug te zetten)
- de eigenschappen van het origineel wijzigen (dmv de verwijzing? ook in de array)

en nu:
als je het origineel wijzigt en later terugzet/vervangt dmv replaceChild, klopt de verwijzing niet meer.
hier raak ik het een beetje kwijt en lukt het niet. geeft replaceChild een nieuwe verwijzing terug?

zijn er voorbeelden van backup, change en restore in JavaScript?

dinsdag 3 april 2007 @ 16:37:37 #128

CraZaay

prettig gestoord

Ook al heb ik nooit zoiets gedaan, het lijkt me dat replaceChild inderdaad een nieuwe verwijzing geeft. Je verwijderd namelijk een element en zet op die plaats een nieuw element neer. De verwijzing die je hebt heeft dan dus nog betrekking op het verwijderde element, dus daar heb je niets meer aan.

Of begrijp ik je verkeerd? Post anders wat relevante code.

dinsdag 3 april 2007 @ 16:47:07 #129

SlimShady

klopt wel wat je zegt. en zo had ik het ook gedaan.
maar het gaat nog steeds fout: de zogenaamd nieuwe verwijzing klopt niet.
dus bekijk ik nu de specificaties. en zie hier wat raars:
Replaces the child node oldChild with newChild in the list of children, and returns the oldChild node.
bron: www.w3.org
daar heb ik wat aan

.

ik ga nog maar 'ns brainstormen...

dinsdag 3 april 2007 @ 17:19:41 #130

SlimShady

dat werkte dus niet. nu heb ik het vervangen door insertbefore, removechild en nextsibling.
en nu werkt het wel. opgelost.

dinsdag 10 april 2007 @ 13:14:55 #131

SHERMAN

Ik heb een monitorings programma met als output een website.

Ik wil deze website standaard open hebben op een computer zodat de status altijd te zien is. Echter, voor deze pagina moet worden ingelogd, en ik wil het vol automatisch is. Ook zou ik graag twee verschillende pagina's om en om op vragen.

Mijn vraag; hoe kan dit? Ik zat te denken om het systeem in een i-frame te knallen en via JS steeds de pagina's af te wisselen, kan dit?

Op vrijdag 12 augustus 2005 01:46 schreef ElisaB het volgende:
Wat is SHERMAN leuk he Bloes O+

dinsdag 10 april 2007 @ 14:05:24 #132

SlimShady

cross-site scripting is gevaarlijk en in FF sterk beveiligd.
ik weet niet hoe dat in IE is. als je FF gebruikt kan je een extensie maken, heb je alle controle.

dinsdag 10 april 2007 @ 14:19:21 #133

SHERMAN

Het gaat waarschijnlijk IE worden, maar het is dus niet zo simpel als dat dat ik dacht?

Op vrijdag 12 augustus 2005 01:46 schreef ElisaB het volgende:
Wat is SHERMAN leuk he Bloes O+

dinsdag 10 april 2007 @ 14:36:46 #134

Geqxon

Op wat voor manier moet er ingelogd worden? Een username / password veld op een pagina oid?

dinsdag 10 april 2007 @ 14:46:44 #135

SHERMAN

quote:
Op dinsdag 10 april 2007 14:36 schreef Geqxon het volgende:
Op wat voor manier moet er ingelogd worden? Een username / password veld op een pagina oid?

Jup.

Ik zat te denken om zelf handmatig in te loggen, en dan die JS te laten runnen, door het steeds opvragen van de pagina's zouden er ook geen session time-outs moeten komen volgens mij..

Op vrijdag 12 augustus 2005 01:46 schreef ElisaB het volgende:
Wat is SHERMAN leuk he Bloes O+

dinsdag 10 april 2007 @ 15:39:28 #136

cyberstalker

Een krachtig neen!

Waarom zou je het met een iframe willen doen? Kun je niet gewoon in die pagina om de zoveel minuten een (AJAX) requestje doen en daarmee het geheel updaten? Lijkt me veel netter.

Anders kun je altijd nog het document zelf verversen.

Hope for the best, prepare for the worst.

dinsdag 10 april 2007 @ 16:12:24 #137

SHERMAN

Omdat ik slechts een beperkte HTML/javascript kennis heb en mij dit het makkelijkste leek..

Op vrijdag 12 augustus 2005 01:46 schreef ElisaB het volgende:
Wat is SHERMAN leuk he Bloes O+

woensdag 11 april 2007 @ 15:36:21 #138

Geqxon

Een zeer kort vraagje:

1	imageobject.style.display = "inline";

Werkt onder Safari en Firefox prima, onder IE niet. Het plaatje is gegenereerd als:

1	<img src="" onload="functie(this)" style="display: none">

Hoe ga ik dit onder Internet Explorer werkend krijgen?

woensdag 11 april 2007 @ 15:55:49 #139

Geqxon

Gevonden. Het is mijn image-resizer, die bij een display = "none" onder IE bij de waarde imageobject.width doodleuk 0 aangeeft.

vrijdag 20 april 2007 @ 11:20:45 #140

George.W.Bush

Ik heb een javascript functie welke een andere functie aanroept.
functie 2 haalt via AJAX een aantal waarden op en zou die moeten returnen naar functie 1.
functie 1 moet vervolgens die values in een innerHMTL zetten:

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

<?php
// functie 1
function getpageBody(name) {
    http.open("GET", urlpageBody + escape(name), true);
    http.onreadystatechange = function() {
    if (http.readyState == 4) {
    results = http.responseText;
        if(results!=''){
             document.getElementById('PageVersion').innerHTML=getVersions(name); // dit gaat dus blijkbaar fout
        }else{
             document.getElementById('PageVersion').innerHTML=' ';
        }
    }
}
    http.send(null);
}

//functie 2
function getVersions(page) {
    http.open("GET", urlgetVersions + escape(page), true);
    http.onreadystatechange = function() {
    if (http.readyState == 4) {
    results = http.responseText;
        if(results!=''){
             return http.responseText;
        }else{
             return('leeg');
        }
    }
}
    http.send(null);
}
?>

Zodra ik deze functies aanroep/ activeer, geeft mijn element PageVersions 'undefined' te zien.
Als ik in functie 2 de return verander in een document.write laat deze wel degelijk de te verwachten output zien. Maar deze output komt op de een of andere manier niet correct in functie 1 terecht.

Wat doe ik fout?

O say, can you see, by the dawn's early light. What so proudly we hailed, at the twilight's last gleaming...

vrijdag 20 april 2007 @ 11:27:12 #141

cyberstalker

Een krachtig neen!

quote:
Op vrijdag 20 april 2007 11:20 schreef George.W.Bush het volgende:
Ik heb een javascript functie welke een andere functie aanroept.
functie 2 haalt via AJAX een aantal waarden op en zou die moeten returnen naar functie 1.
functie 1 moet vervolgens die values in een innerHMTL zetten:

[ code verwijderd ]
Zodra ik deze functies aanroep/ activeer, geeft mijn element PageVersions 'undefined' te zien.
Als ik in functie 2 de return verander in een document.write laat deze wel degelijk de te verwachten output zien. Maar deze output komt op de een of andere manier niet correct in functie 1 terecht.

Wat doe ik fout?

Volgens mij begrijp jij het concept van AJAX niet helemaal. De eerste A staat namelijk voor asynchronous. Dit houdt in dat je functie niet gaat zitten wachten op input van de webserver. De hele onreadystate functie wordt pas aangeroepen op het moment dat de webserver iets terugstuurt. Je functie retourneert dus inderdaad nooit iets.

Je zult dus vanuit die functie zelf wat dingen moeten veranderen.

Hope for the best, prepare for the worst.

vrijdag 20 april 2007 @ 11:36:11 #142

George.W.Bush

quote:
Op vrijdag 20 april 2007 11:27 schreef cyberstalker het volgende:

[..]

Volgens mij begrijp jij het concept van AJAX niet helemaal. De eerste A staat namelijk voor asynchronous. Dit houdt in dat je functie niet gaat zitten wachten op input van de webserver. De hele onreadystate functie wordt pas aangeroepen op het moment dat de webserver iets terugstuurt. Je functie retourneert dus inderdaad nooit iets.

Je zult dus vanuit die functie zelf wat dingen moeten veranderen.

eh nee, die functie retourneert wel degelijk wat. De volgende regel:

1	http.open("GET", urlgetVersions + escape(page), true);

is wat helderder als je deze erbij hebt

1	var urlgetVersions = "../system/versions.php?page="

Nogmaals, als ik in functie 2 document.write(http.responseText); schrijf ipv return http.responseText; krijg ik gewoon keurig datgene van de webserver te zien wat ik nodig heb en http.responseText heeft dus value, namelijk het resultaat van een query:

1
2
3
4
5
6
7

Versie:
<select onChange="getpageVersion(this.options[this.selectedIndex].value)">
   <option selected="selected">Huidige versie</option>
   <option value="6">-1</option>
   <option value="2">-2</option>
   <option value="1">-3</option>
</select>

[ Bericht 6% gewijzigd door George.W.Bush op 20-04-2007 11:45:09 ]

O say, can you see, by the dawn's early light. What so proudly we hailed, at the twilight's last gleaming...

vrijdag 20 april 2007 @ 11:44:23 #143

cyberstalker

Een krachtig neen!

quote:
Op vrijdag 20 april 2007 11:36 schreef George.W.Bush het volgende:

[..]

eh nee, die functie retourneert wel degelijk wat. De volgende regel:

[ code verwijderd ]

is wat helderder als je deze erbij hebt

[ code verwijderd ]

Nogmaals, als ik in functie 2 document.write('http.responseText'); schrijf ipv return http.responseText; krijg ik gewoon keurig datgene van de webserver te zien wat ik nodig heb.

Je snapt het nog steeds niet. Het stuk vanaf de http.onreadystatechange = function() { tot en met de bijbehorende } wordt niet uitgevoerd totdat er een resultaat is. Dit is dus wat er direct wordt uitgevoerd:

1
2
3
4
5

function getVersions(page)
{
http.open("GET", urlgetVersions + escape(page), true);
http.send(null);
}

En natuurlijk werkt een document.write daar. Die wordt dan uitgevoerd op het moment dat er een resultaat is. Op dat moment is jouw functie getVersions al gestopt zonder een returnvalue.

Hope for the best, prepare for the worst.

vrijdag 20 april 2007 @ 11:48:42 #144

George.W.Bush

quote:
Op vrijdag 20 april 2007 11:44 schreef cyberstalker het volgende:

[..]

Je snapt het nog steeds niet. Het stuk vanaf de http.onreadystatechange = function() { tot en met de bijbehorende } wordt niet uitgevoerd totdat er een resultaat is. Dit is dus wat er direct wordt uitgevoerd:
[ code verwijderd ]

En natuurlijk werkt een document.write daar. Die wordt dan uitgevoerd op het moment dat er een resultaat is. Op dat moment is jouw functie getVersions al gestopt zonder een returnvalue.

Die document.write wordt toch op hetzelfde moment uitgevoerd als die return. Die return vind pas plaats bij de onreadstate

O say, can you see, by the dawn's early light. What so proudly we hailed, at the twilight's last gleaming...

vrijdag 20 april 2007 @ 11:51:31 #145

cyberstalker

Een krachtig neen!

quote:
Op vrijdag 20 april 2007 11:48 schreef George.W.Bush het volgende:

[..]

Die document.write wordt toch op hetzelfde moment uitgevoerd als die return. Die return vind pas plaats bij de onreadstate

Klopt inderdaad. Verschil is alleen dat op het moment van die onreadystatechange de functie getVersions allang gestopt is. Die gaat daar niet op zitten wachten. Dat is het hele idee van dat asynchronous. Jij denkt in lineaire code en daar ga je de mist in.

Hope for the best, prepare for the worst.

vrijdag 20 april 2007 @ 11:55:33 #146

George.W.Bush

quote:
Op vrijdag 20 april 2007 11:51 schreef cyberstalker het volgende:

[..]

Klopt inderdaad. Verschil is alleen dat op het moment van die onreadystatechange de functie getVersions allang gestopt is. Die gaat daar niet op zitten wachten. Dat is het hele idee van dat asynchronous. Jij denkt in lineaire code en daar ga je de mist in.

Je bedoelt dat functie een al gestopt is?
Je zegt nu functie 2.
Maar functie 2 returned wel, maar dan is functie 1 al klaar bedoel je?

1	document.getElementById('PageVersion').innerHTML=getVersions(name);

die PageVersion element blijft leeg, want op het moment van aanroepen is getVerions(name) nog leeg....
Dat bedoel je?
Als ik dan in functie 1 een var maak die gevuld wordt met getVersions en die var in de innerHTML zet zou het wel moeten werken toch?

[ Bericht 15% gewijzigd door George.W.Bush op 20-04-2007 12:01:00 ]

O say, can you see, by the dawn's early light. What so proudly we hailed, at the twilight's last gleaming...

vrijdag 20 april 2007 @ 12:44:51 #147

George.W.Bush

fuck, ook met een timertje ingebouwd werkt het niet.

1 2	var version=getVersions(name); setTimeout("document.getElementById('PageVersion').innerHTML="+version+"",1000);

iemand nog een idee hoe ik functie 1 kan laten wachten op de results van functie 2?

[ Bericht 45% gewijzigd door George.W.Bush op 20-04-2007 12:51:34 ]

O say, can you see, by the dawn's early light. What so proudly we hailed, at the twilight's last gleaming...

vrijdag 20 april 2007 @ 13:27:08 #148

George.W.Bush

Opgelost, functie 2 in functie 1 geintegreerd

O say, can you see, by the dawn's early light. What so proudly we hailed, at the twilight's last gleaming...

vrijdag 20 april 2007 @ 13:29:47 #149

cyberstalker

Een krachtig neen!

quote:
Op vrijdag 20 april 2007 12:44 schreef George.W.Bush het volgende:
fuck, ook met een timertje ingebouwd werkt het niet.

[ code verwijderd ]

iemand nog een idee hoe ik functie 1 kan laten wachten op de results van functie 2?

Je begrijpt het zo te zien nog steeds niet. Omdat ik niet het idee heb dat ik het je zo uit kan leggen dat je het zelf begrijpt heb ik hier een voorbeeldje dat zou moeten werken (niet getest):

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

Sowieso is het vreemd dat je in zowel functie 1 als functie 2 een http request doet.

Hope for the best, prepare for the worst.

vrijdag 20 april 2007 @ 14:07:14 #150

George.W.Bush

quote:
Op vrijdag 20 april 2007 13:29 schreef cyberstalker het volgende:

[..]

Je begrijpt het zo te zien nog steeds niet. Omdat ik niet het idee heb dat ik het je zo uit kan leggen dat je het zelf begrijpt heb ik hier een voorbeeldje dat zou moeten werken (niet getest):
[ code verwijderd ]

Zie de post boven je, ik heb iets soortgelijks gedaan. Ik begreep je wel, maar wist even niet hoe het op te lossen. Door inderdaad beide functie's in 1 functie te integreren is het probleem opgelost.

quote:
Sowieso is het vreemd dat je in zowel functie 1 als functie 2 een http request doet.

Dat valt wel mee volgens mij. http request 1 trekt de inhoud van een gekozen pagina uit de pagina tabel en plaatst die in mijn fckeditor (getPageBody). In deze funtie heb ik nu getVersions geintegreerd die via een xmlhttprequest een andere query uitvoert die uit de versie tabel het aantal versies van de gekozen pagina haalt en deze toont.

Nu kan ik van de gekozen pagina een eerdere versie kiezen, waarbij, wederom met een xmlhttprequest de body van deze oudere versie uit de versie tabel wordt gehaald en in de fckeditor wordt geplaatst (getpageVersion).

Nu kan ik dus in een cms omgeving pagina's opvragen en vervolgens versies van die pagina's opvragen zonder refresh. Vooral omdat het anders een 3 traps serverside raket zou worden vond ik dit eenvoudiger

O say, can you see, by the dawn's early light. What so proudly we hailed, at the twilight's last gleaming...

Forum Opties
Forumhop:
Hop naar:	(afkorting, bv 'KLB')

» digital corner

» digital corner