[Javascript] voor dummies deel 5

vrijdag 4 mei 2007 @ 16:17:03 #226

SlimShady

alleen css is dus niet voldoende. javascript is nodig.
er zijn demo's:
http://www.flog.co.nz/lab/ARC/ARC.htm
http://www.hellgatelondon.com/demons/

vrijdag 4 mei 2007 @ 19:36:09 #227

cyberstalker

Een krachtig neen!

quote:
Op vrijdag 4 mei 2007 16:17 schreef SlimShady het volgende:
alleen css is dus niet voldoende. javascript is nodig.
er zijn demo's:
http://www.flog.co.nz/lab/ARC/ARC.htm
http://www.hellgatelondon.com/demons/

Het is wel mogelijk met enkel CSS. Voor IE is dan wel een extra scriptje nodig omdat IE zoals gewoonlijk weer bagger is en de :checked pseudo-class niet ondersteunt. Dit kan waarschijnlijk wel met een unobtrusive scriptje maar daar weet ik het fijne niet van omdat ik nooit met IE werk.

Het principe is simpel. Je verbergt de checkbox met CSS door de display op none te zetten. Vervolgens zet je direct achter de checkbox een label attribuut die je met css de juiste achtergrondafbeelding geeft. Is de checked waarde van het attribuut verandert, dan wijzig je de achtergrondafbeelding. Een voorbeeldje:

De CSS

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

form input[type="checkbox"]
{
    display: none;
}

form input[type="checkbox"] + label[for]
{
    display: block;
    width: 20px;
    height: 20px;
    opacity: 0.7;
}

form input[type="checkbox"]:checked + label[for]
{
    opacity: 1;
}

form input[type="checkbox"] + label[for="waarde1"]
{
    background-image: url('images/value1_notchecked.png');
}

Het formulier:

1
2
3
4
5
6
7
8

<form action="whatever.php" method="post">
    <fieldset>
        <legend>Formulier met plaatjes als checkboxjes</legend>

        <input type="checkbox" id="value1" name="value1">
        <label for="value1"></label>
    </fieldset>
</form>

[ Bericht 5% gewijzigd door cyberstalker op 04-05-2007 19:46:31 ]

Hope for the best, prepare for the worst.

zaterdag 5 mei 2007 @ 22:28:14 #228

GBCHEATER

Wat nou?

Hallo,
Ik ben bezig met een scriptje om te kijken of domeinnamen vrij zijn of niet. Dit doe ik met de volgende 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
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80

Ik roep de functie start aan als volgt:

1
2
3
4
5
6

Ik heb alleen het probleem dat het niet helemaal lekker werkt. Behalve het feit dat de layout totaal niet klopt, blijft in dit geval het nl domein op aangemaakt staan.

:edit:
Wat ik dus krijg is dit:
Tld Beschikbaar me.nl
Aangemaakt
me.com
Bezet

Wat doe ik fout?

[ Bericht 2% gewijzigd door GBCHEATER op 06-05-2007 01:01:49 ]

zaterdag 5 mei 2007 @ 22:51:21 #229

mschol

ik heb nu een zoek formulier:

1
2
3
4

<form id="search" name="search_form_basic" action="search/" method="GET">
<input name="searchFor" type="text" size="10">
<a href="javascript:void(0);" onClick="javascript:search_form_basic.submit();">search</a>
</form>

en ik wil het volgende hebben:

als ik zoek moet de url als volgt worden opgebouwd:
<domeinnaam>/search/verschillende_zoek_termen.html

kan dat uberhaupt met alleen Javascript em zo ja hoe moet ik dat aanpakken?

zaterdag 5 mei 2007 @ 23:00:08 #230

Geqxon

1
2
3
4
5
6
7
8
9
10

Al ben ik te lui het te runnen

zaterdag 5 mei 2007 @ 23:06:12 #231

mschol

quote:
Op zaterdag 5 mei 2007 23:00 schreef Geqxon het volgende:

[ code verwijderd ]

Al ben ik te lui het te runnen

geeft niet, et werkt

--edit--

het grootste gedeelte dan..
als ik }$%$# als string invoer kom ik uit op http://home.mschol.eu/search/ terwijl de javascript alert mij wel de juiste url terug geeft (http://home.mschol.eu/search/}$%$#.html )

even kijken met FF
hmm runsearch is not defined... -> die is opgelost maar nog steeds als je zo'n vreemde url doet, stopt ie...

nou ja jammer, voor latere zorg, bouw wel een extra check in me search..

[ Bericht 17% gewijzigd door mschol op 05-05-2007 23:23:21 ]

zondag 6 mei 2007 @ 00:01:38 #232

cyberstalker

Een krachtig neen!

quote:
Op zaterdag 5 mei 2007 23:06 schreef mschol het volgende:

[..]

geeft niet, et werkt

--edit--

het grootste gedeelte dan..
als ik }$%$# als string invoer kom ik uit op http://home.mschol.eu/search/ terwijl de javascript alert mij wel de juiste url terug geeft (http://home.mschol.eu/search/}$%$#.html )

even kijken met FF
hmm runsearch is not defined... -> die is opgelost maar nog steeds als je zo'n vreemde url doet, stopt ie...

nou ja jammer, voor latere zorg, bouw wel een extra check in me search..

Misschien is het eenvoudiger om hier met een simpele mod_rewrite te werken. Werkt stukken eenvoudiger hier

.

Hope for the best, prepare for the worst.

zondag 6 mei 2007 @ 00:21:04 #233

GBCHEATER

Wat nou?

Ik heb mijn functie aangepast dat hij op xmlHttp.readyState 1 t/m 3 checking in de div zet, en op 4 de response neerzet. En ik heb de locatie verplaatst, zodat de tabel maar 1 keer word weggeschreven.

Dit heeft alweer hetzelfde resultaat:

TldBeschikbaarnl
Checking
com
Bezet

- Kan je wel met een tabel in een div werken via javascript? (omdat de layout zo verrot is)
- Kan ik een functie meerdere keren aanroepen met een parameter die verschillend is?

:edit:
Hmz, bug in Replique? Ik krijg elke keer wanneer ik mijn code edit een hidden field bij mijn formulier, met daarin mijn sessieid?

zondag 6 mei 2007 @ 00:36:44 #234

cyberstalker

Een krachtig neen!

quote:
Op zondag 6 mei 2007 00:21 schreef GBCHEATER het volgende:
:edit:
Hmz, bug in Replique? Ik krijg elke keer wanneer ik mijn code edit een hidden field bij mijn formulier, met daarin mijn sessieid?

Is bekend en niet gevaarlijk. Het sessieid wat je ziet is niet eentje waarme je iets kunt

.

Hope for the best, prepare for the worst.

zondag 6 mei 2007 @ 00:40:16 #235

GBCHEATER

Wat nou?

quote:
Op zondag 6 mei 2007 00:36 schreef cyberstalker het volgende:

[..]

Is bekend en niet gevaarlijk. Het sessieid wat je ziet is niet eentje waarme je iets kunt .

Kreeg hetzelfde antwoord in de bug afdeling

Weet jij misschien een oplossing voor mijn Ajax probleem hierboven?

zondag 6 mei 2007 @ 00:58:22 #236

Geqxon

Ik kan je niet helpen, maar ik raad je aan om je HTML output eerst in een variabele te stoppen, en als je daar mee klaar bent iets in de trant van "innerhtml = output" te doen.

Daarmee wordt gelijk je huidige inhoud overschreden, en je sourcecode is wat netter.

zondag 6 mei 2007 @ 01:00:46 #237

GBCHEATER

Wat nou?

quote:
Op zondag 6 mei 2007 00:58 schreef Geqxon het volgende:
Ik kan je niet helpen, maar ik raad je aan om je HTML output eerst in een variabele te stoppen, en als je daar mee klaar bent iets in de trant van "innerhtml = output" te doen.

Daarmee wordt gelijk je huidige inhoud overschreden, en je sourcecode is wat netter.

Dat heeft iig mijn layout probleem opgelost

Nou de rest nog

zondag 6 mei 2007 @ 13:03:38 #238

GBCHEATER

Wat nou?

Ik heb nu mijn domeinenArray even uitgebreid. Ik heb nu:

1	var array = new Array("com","net", "be", "nl");

En nu is dit de uitvoer:

Tld Beschikbaar
com Checking
net Bezet
be Checking
nl Bezet

Nummer 1 en 3 blijven dus weer op checking staan. Ik weet dat ik een uitvoer terugkrijg, ik kan namelijk debuggen met FireBug, en deze geeft aan dat ik wel antwoord terugkrijg.

zondag 6 mei 2007 @ 14:37:40 #239

SuperRembo

Sinds 1998

GBCHEATER, lopen je httprequests niet door elkaar? Ik bedoel dat bijvoorbeeld het resultaat van de .com check bij het .net resultaat komt te staan. Om dat te controleren zou je wat extra debug info moeten schrijven (in js en php).

zondag 6 mei 2007 @ 14:46:17 #240

GBCHEATER

Wat nou?

quote:
Op zondag 6 mei 2007 14:37 schreef SuperRembo het volgende:
GBCHEATER, lopen je httprequests niet door elkaar? Ik bedoel dat bijvoorbeeld het resultaat van de .com check bij het .net resultaat komt te staan. Om dat te controleren zou je wat extra debug info moeten schrijven (in js en php).

Daar maak ik me ook zorgen over, kan het uberhaupt wel zoals ik het nu heb gedaan? Wanneer ik zes tld's neem, word alleen de laatste vervangen. Dus ik ben inderdaad bang dat dat het is. Maar hoe zou je dat kunnen oplossen behalve voor elke tld een aparte functie schrijven?

:edit:
Als ik een alert plaats in xm.Http.readyState 1 t/m3 krijg ik 5 keer voor elke tld een alert. Plaats ik er een in xmlHttp.readystate 4 krijg ik hem alleen voor de laatste.

zondag 6 mei 2007 @ 14:47:48 #241

SlimShady

nee, één functie die je x keer aanroept.

zondag 6 mei 2007 @ 14:52:25 #242

GBCHEATER

Wat nou?

quote:
Op zondag 6 mei 2007 14:47 schreef SlimShady het volgende:
nee, één functie die je x keer aanroept.

Dat heb ik nu dus gedaan:

Voor elk element in de array roep ik deze functie aan:

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

[ Bericht 9% gewijzigd door GBCHEATER op 06-05-2007 16:02:46 ]

zondag 6 mei 2007 @ 16:18:27 #243

SuperRembo

Sinds 1998

quote:
Op zondag 6 mei 2007 14:46 schreef GBCHEATER het volgende:

[..]

Daar maak ik me ook zorgen over, kan het uberhaupt wel zoals ik het nu heb gedaan? Wanneer ik zes tld's neem, word alleen de laatste vervangen. Dus ik ben inderdaad bang dat dat het is. Maar hoe zou je dat kunnen oplossen behalve voor elke tld een aparte functie schrijven?

:edit:
Als ik een alert plaats in xm.Http.readyState 1 t/m3 krijg ik 5 keer voor elke tld een alert. Plaats ik er een in xmlHttp.readystate 4 krijg ik hem alleen voor de laatste.

Een alert is in een geval als dit niet handig, want het gaat juist om de volgorde waarin dingen (bijna tegelijk) gebeuren. Je kan beter wat loggen in bijvoorbeeld een textarea. (Daar heb ik ooit een scriptje voor gemaakt.)

Volgens mij mist er een "var" bij xmlHttp in whois(), ik weet niet of dat echt de oplossing is.

zondag 6 mei 2007 @ 16:35:49 #244

GBCHEATER

Wat nou?

quote:
Op zondag 6 mei 2007 16:18 schreef SuperRembo het volgende:

[..]

Een alert is in een geval als dit niet handig, want het gaat juist om de volgorde waarin dingen (bijna tegelijk) gebeuren. Je kan beter wat loggen in bijvoorbeeld een textarea. (Daar heb ik ooit een scriptje voor gemaakt.)

Volgens mij mist er een "var" bij xmlHttp in whois(), ik weet niet of dat echt de oplossing is.

Mag ik je even bedanken :X

Dat was hem, ik heb aan de code toegevoegd:

1	var xmlHttp = null;

En hij doet het!

Tnx 8)7

zaterdag 12 mei 2007 @ 17:21:13 #245

GBCHEATER

Wat nou?

Was ik weer, met een nieuw probleempje:

Situatie:
Ik heb een scriptje om een C++ functie om te zetten naar wiki code. Nou heb je bij een functie meerdere parameters, of geen. Dus ik dacht van, dat doe ik via een functie:

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

function addParameter(aantal)
{
   var aantalParameters = aantal;
   var parameters = '';
   aantalParameters++;

   parameters += '<div id="parameterDiv"'+aantalParameters+'>';
   parameters += '<tr>';
    parameters += '<td align="center">';
    parameters += '<table width="450" border="0" cellspacing="0" cellpadding="0">';
    parameters += '<tr>';
    parameters += '<td class="subHeader"> ';
    parameters += '</td>';
    parameters += '<td class="subHeader">';
    parameters += '<div id="parameterTitel'+aantalParameters+'"></div>';
    parameters += '</td>';
    parameters += '</tr>';
    parameters += '<tr>';
    parameters += '<td width="100">Type:</td>';
    parameters += '<td><input name="txtParamaterType'+aantalParameters+'" id="txtParamaterType'+aantalParameters+'" type="text" class="txt" size="51" onkeyup="modifyParameterTitle('+aantalParameters+')"/></td>';
    parameters += '</tr>';
    parameters += '<tr>';
    parameters += '<td>Naam:</td>';
    parameters += '<td><input name="txtParameterNaam'+aantalParameters+'" id="txtParameterNaam'+aantalParameters+'" type="text" class="txt" size="51" onkeyup="modifyParameterTitle('+aantalParameters+')"/></td>';
    parameters += '</tr>';
    parameters += '<tr>';
    parameters += '<td valign="top">Omschrijving:</td>';
    parameters += '<td><textarea name="txtParameterOmschrijving'+aantalParameters+'" id="txtParameterOmschrijving'+aantalParameters+'" cols="38" rows="5" class="txt"></textarea></td>';
    parameters += '</tr>';
    parameters += '</table>';
    parameters += '</td>';
    parameters += '</tr> ';
   parameters += '</div>';

   document.getElementById("divFunctionParameter").innerHTML += parameters;
   document.getElementById("divVoegParameterToe").innerHTML = '<a href="javascript: addParameter('+aantalParameters+');">Voeg Toe</a>';
}

En dit start ik door een link in de pagina te zetten dmv:

1
2
3
4
5
6

body onload="javascript: start()"

function start()
{
document.getElementById("divVoegParameterToe").innerHTML = '<a href="javascript: addParameter(0);">Voeg Toe</a>';
}

Dit werkt allemaal heel erg goed, maar het probleem is dat wanneer ik iets ingevuld heb in een van deze parameters en ik daarna op voeg toe druk, komt de tekst te vervallen die in de textboxjes en textfields staan. De titel in de parametertitel div blijft wel staan.

Enig idee hoe ik de inhoud van die textfields en textboxjes kan behouden?

zaterdag 12 mei 2007 @ 18:04:54 #246

GBCHEATER

Wat nou?

Kan een modje deze en de post hierboven verwijderen, probleem is opgelost, maar kan mijn post hierboven niet editten.

zaterdag 12 mei 2007 @ 21:00:48 #247

super-muffin

Je kan ook de oplossing posten

Steam - SC2

zaterdag 12 mei 2007 @ 21:09:24 #248

GBCHEATER

Wat nou?

quote:
Op zaterdag 12 mei 2007 21:00 schreef super-muffin het volgende:
Je kan ook de oplossing posten :)

De oplossing was bij een "bijplaatsing" eerst de bestaande parameters opvragen, en daarna de inhoud van de div te overschrijven (ja vies, maar werkt wel):

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

totaal = 0;
function addParameter()
{
   var parameters = '';

   //totaal ophogen
   totaal++;

   if(totaal != 1)
   {
      //oude parameters ophalen
      for(var x = 1; x < totaal; x++)
      {
         parameters += '<div id="parameterDiv'+x+'">';
         parameters += '<tr>';
         parameters += '<td align="center">';
         parameters += '<table width="450" border="0" cellspacing="0" cellpadding="0">';
         parameters += '<tr>';
         parameters += '<td class="subHeader"> ';
         parameters += '</td>';
         parameters += '<td class="subHeader">';
         parameters += '<div id="parameterTitel'+x+'">'+document.getElementById("parameterTitel"+x).innerHTML+'</div>';
         parameters += '</td>';
         parameters += '</tr>';
         parameters += '<tr>';
         parameters += '<td width="100">Type:</td>';
         parameters += '<td><input name="txtParamaterType'+x+'" id="txtParamaterType'+x+'" type="text" class="txt" size="51" onkeyup="modifyParameterTitle('+x+')" value="'+document.getElementById("txtParamaterType"+x).value+'"/></td>';
         parameters += '</tr>';
         parameters += '<tr>';
         parameters += '<td>Naam:</td>';
         parameters += '<td><input name="txtParameterNaam'+x+'" id="txtParameterNaam'+x+'" type="text" class="txt" size="51" onkeyup="modifyParameterTitle('+x+')" value="'+document.getElementById("txtParameterNaam"+x).value+'"/></td>';
         parameters += '</tr>';
         parameters += '<tr>';
         parameters += '<td valign="top">Omschrijving:</td>';
         parameters += '<td><textarea name="txtParameterOmschrijving'+x+'" id="txtParameterOmschrijving'+x+'" cols="38" rows="5" class="txt">'+document.getElementById("txtParameterOmschrijving"+x).value+'</textarea></td>';
         parameters += '</tr>';
         parameters += '</table>';
         parameters += '</td>';
         parameters += '</tr> ';
         parameters += '</div>';
      }
   }

   // nieuwe parameter toevoegen
   parameters += '<div id="parameterDiv'+totaal+'">';
   parameters += '<tr>';
   parameters += '<td align="center">';
   parameters += '<table width="450" border="0" cellspacing="0" cellpadding="0">';
   parameters += '<tr>';
   parameters += '<td class="subHeader"> ';
   parameters += '</td>';
   parameters += '<td class="subHeader">';
   parameters += '<div id="parameterTitel'+totaal+'"></div>';
   parameters += '</td>';
   parameters += '</tr>';
   parameters += '<tr>';
   parameters += '<td width="100">Type:</td>';
   parameters += '<td><input name="txtParamaterType'+totaal+'" id="txtParamaterType'+totaal+'" type="text" class="txt" size="51" onkeyup="modifyParameterTitle('+totaal+')"/></td>';
   parameters += '</tr>';
   parameters += '<tr>';
   parameters += '<td>Naam:</td>';
   parameters += '<td><input name="txtParameterNaam'+totaal+'" id="txtParameterNaam'+totaal+'" type="text" class="txt" size="51" onkeyup="modifyParameterTitle('+totaal+')"/></td>';
   parameters += '</tr>';
   parameters += '<tr>';
   parameters += '<td valign="top">Omschrijving:</td>';
   parameters += '<td><textarea name="txtParameterOmschrijving'+totaal+'" id="txtParameterOmschrijving'+totaal+'" cols="38" rows="5" class="txt"></textarea></td>';
   parameters += '</tr>';
   parameters += '</table>';
   parameters += '</td>';
   parameters += '</tr> ';
   parameters += '</div>';

   document.getElementById("divFunctionParameter").innerHTML = parameters;
}

zaterdag 12 mei 2007 @ 23:53:28 #249

CraZaay

prettig gestoord

Sowieso zou DOM-scripting wat netter zijn

zondag 13 mei 2007 @ 00:03:02 #250

GBCHEATER

Wat nou?

Op wat voor opzicht dan? Heb net even de tutorial @ w3schools doorgekeken, maar zie het verschil niet helemaal, op het feit dat het in iets meer substapjes gaat, of getElementsByTagName gebruikt word.

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

» digital corner

» digital corner