id naar div sturen
bij weblog zie je 3 weergaven.
1. gedeelte tekst + lees verder (moet nog relealiseerd worden)
2. opgesomde items
3. enkel item (moet nog gerealiseerd worden)
Deze 3 weergaves staan in divs, welke door middel van visibility worden getoond/verborgen. Nu wil ik dus door midden van een klik op een titel uit de 2de weergave en de 'lees meer' uit de eerste weergave, het volledige bericht tonen in de 3de weergave.
Hoe doe ik dit?
Kan ik een id naar een div sturen welke vervolgens bijbehorende tekst uit de database opvraagd?
Gewijzigd op 01/01/1970 01:00:00 door Frank
Jurgen schreef op 16.09.2007 22:25:
Je kunt gewoon via PHP het id meesturen naar de div en vervolgens met js onclick="functie(elementnaam)" oid.
elementnaam? alsin?
ik wil bv het id weblogid meesturen (bv ?weblogid=23)
Code (php)
1
<a href="?weblogid=123">titel van de weblog</a>
kun je gewoon via $_GET['weblogid'] de juiste inhoud uit je DB laten rollen.
mijn code voor de weblog pagina is:
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
weergave: <a onClick="toggleBox('weblog-indeling1',0), toggleBox('weblog-indeling2',1), toggleBox('weblog-indeling3',0);" onMouseover="this.style.cursor='pointer'" value="Hide div"><img src="img/algemene-opmaak-extra/icon-weblog-weergave-50.gif" border="0" /></a>
<a onClick="toggleBox('weblog-indeling1',1), toggleBox('weblog-indeling2',0), toggleBox('weblog-indeling3',0);" onMouseover="this.style.cursor='pointer'" value="Hide div"><img src="img/algemene-opmaak-extra/icon-weblog-weergave-1.gif" border="0" /></a>
<a onClick="toggleBox('weblog-indeling1',0), toggleBox('weblog-indeling2',0), toggleBox('weblog-indeling3',1);" onMouseover="this.style.cursor='pointer'" value="Hide div"><img src="img/algemene-opmaak-extra/icon-weblog-weergave-100.gif" border="0"/></a>
<div ID="weblog-indeling2" class="weblog-indeling2">
<?
$result3 = mysql_query("SELECT * FROM weblog ORDER BY `weblogid` DESC " ) or die (mysql_error());
while ($rij3 = mysql_fetch_array($result3))
{
echo("<table width='100%' border='0'>");
echo("<tr>");
echo("<td width='70%'><b><i><font color='#7F4F11'>" . $rij3[2] . "</font></i></b></td>");
echo("<td width='30%'><div align='right'>" . $rij3[1] . "</div></td>");
echo("</tr>");
echo("<tr>");
echo("<td colspan='2'><div align='justify'>");
$tekst = "$rij3[3]";
$short = ShortTxt($tekst, 50);
echo $short;
echo("</div></td>");
echo("</tr>");
echo("</table>");
echo("<br /><br />");
}
?>
<br />
</div>
<div ID="weblog-indeling1" class="weblog-indeling1">
<?
$result3 = mysql_query("SELECT * FROM weblog ORDER BY `weblogid` DESC " ) or die (mysql_error());
while ($rij3 = mysql_fetch_array($result3))
{
echo("<table width='100%' border='0'>");
echo("<tr>");
echo("<td width='70%'><a onClick='toggleBox('weblog-indeling1',0), toggleBox('weblog-indeling2',0), toggleBox('weblog-indeling3',1);' onMouseover='this.style.cursor='pointer'' href='?weblogid=123'><b><i><font color='#7F4F11'>" . $rij3[2] . "</font></i></b></a></td>");
echo("<td width='30%'><div align='right'>" . $rij3[1] . "</div></td>");
echo("</tr>");
echo("</table>");
}
?>
</div>
<div ID="weblog-indeling3" class="weblog-indeling3">
<?PHP
$weblogid = $_GET[weblogid];
?>
<?
$result3 = mysql_query("SELECT * FROM weblog WHERE weblogid = '$weblogid' " ) or die (mysql_error());
{
echo("<table width='100%' border='0'>");
echo("<tr>");
echo("<td width='70%'><b><i><font color='#7F4F11'>" . $rij3[2] . "</font></i></b></td>");
echo("<td width='30%'><div align='right'>" . $rij3[1] . "</div></td>");
echo("</tr>");
echo("<tr>");
echo("<td colspan='2'><div align='justify'>" . $rij3[3] . "</div></td>");
echo("</tr>");
echo("</table>");
echo("<br /><br />");
}
?>
</div>
<a onClick="toggleBox('weblog-indeling1',1), toggleBox('weblog-indeling2',0), toggleBox('weblog-indeling3',0);" onMouseover="this.style.cursor='pointer'" value="Hide div"><img src="img/algemene-opmaak-extra/icon-weblog-weergave-1.gif" border="0" /></a>
<a onClick="toggleBox('weblog-indeling1',0), toggleBox('weblog-indeling2',0), toggleBox('weblog-indeling3',1);" onMouseover="this.style.cursor='pointer'" value="Hide div"><img src="img/algemene-opmaak-extra/icon-weblog-weergave-100.gif" border="0"/></a>
<div ID="weblog-indeling2" class="weblog-indeling2">
<?
$result3 = mysql_query("SELECT * FROM weblog ORDER BY `weblogid` DESC " ) or die (mysql_error());
while ($rij3 = mysql_fetch_array($result3))
{
echo("<table width='100%' border='0'>");
echo("<tr>");
echo("<td width='70%'><b><i><font color='#7F4F11'>" . $rij3[2] . "</font></i></b></td>");
echo("<td width='30%'><div align='right'>" . $rij3[1] . "</div></td>");
echo("</tr>");
echo("<tr>");
echo("<td colspan='2'><div align='justify'>");
$tekst = "$rij3[3]";
$short = ShortTxt($tekst, 50);
echo $short;
echo("</div></td>");
echo("</tr>");
echo("</table>");
echo("<br /><br />");
}
?>
<br />
</div>
<div ID="weblog-indeling1" class="weblog-indeling1">
<?
$result3 = mysql_query("SELECT * FROM weblog ORDER BY `weblogid` DESC " ) or die (mysql_error());
while ($rij3 = mysql_fetch_array($result3))
{
echo("<table width='100%' border='0'>");
echo("<tr>");
echo("<td width='70%'><a onClick='toggleBox('weblog-indeling1',0), toggleBox('weblog-indeling2',0), toggleBox('weblog-indeling3',1);' onMouseover='this.style.cursor='pointer'' href='?weblogid=123'><b><i><font color='#7F4F11'>" . $rij3[2] . "</font></i></b></a></td>");
echo("<td width='30%'><div align='right'>" . $rij3[1] . "</div></td>");
echo("</tr>");
echo("</table>");
}
?>
</div>
<div ID="weblog-indeling3" class="weblog-indeling3">
<?PHP
$weblogid = $_GET[weblogid];
?>
<?
$result3 = mysql_query("SELECT * FROM weblog WHERE weblogid = '$weblogid' " ) or die (mysql_error());
{
echo("<table width='100%' border='0'>");
echo("<tr>");
echo("<td width='70%'><b><i><font color='#7F4F11'>" . $rij3[2] . "</font></i></b></td>");
echo("<td width='30%'><div align='right'>" . $rij3[1] . "</div></td>");
echo("</tr>");
echo("<tr>");
echo("<td colspan='2'><div align='justify'>" . $rij3[3] . "</div></td>");
echo("</tr>");
echo("</table>");
echo("<br /><br />");
}
?>
</div>
(zie www.frank-raterink.nl/2 (LET OP! 2 hoort erachter!)
achter elkaar zie je 3 div's, indeling2, indeling1, indeling3. Van indeling2 en indeling1 wil ik naar indeling3 linken. En dus het liefst zonder reflesh (of evt. alleen bij aankomst op die pagina)
Heel de website is overigens op deze manier opgebouwd
ik hoop dat deze info meer inzicht geeft in mn probleem
Gewijzigd op 01/01/1970 01:00:00 door frank
Je site is echter niet crossbrowser compatible. In Firefox, Konqueror (beide op Linux) en Safari blijft je site hangen bij het laden (Bij "Een moment geduld alstublieft..."). Alleen in Opera werkt hij hier, maar ook niet helemaal naar behoren lijkt het.
Wel supertoffe layout verder!
Edit:
En wanneer je de url tussen tags zet, moet hij die 2 wel meepakken. geeft http://www.frank-raterink.nl/2/
Code (php)
1
[url]http://www.frank-raterink.nl/2/[/url]
Gewijzigd op 01/01/1970 01:00:00 door Winston Smith
SanThe schreef op 19.09.2007 16:39:
Dat zeg ik :) Paar dagen terug deed hij het in Firefox op Windows wel prima. Weet niet of intussen de code veranderd is, of dat ik toen gewoon geluk had :PGebeurt niks op die link. Draaiend cirkeltje en 'Een moment geduld alstublieft...'. Duurt nu al enkele minuten.
Kasper schreef op 19.09.2007 16:33:
Het is nog niet gelukt...Lijkt erop dat het al gelukt is?
Kasper schreef op 19.09.2007 16:33:
Daar moet ik inderdaad nog naar kijken, maar volgens mij was het alleen het laadschermJe site is echter niet crossbrowser compatible.
Kasper schreef op 19.09.2007 16:33:
Thanks!Wel supertoffe layout verder!
Het probleem is dus nog gaande...
Kan je de info uit een database lezen zonder pagina reload?
(het doel van mijn website is om snel alle informatie te kunnen bekijken, door in 1 keer alles te laden, geen reloads etc..)
Gewijzigd op 01/01/1970 01:00:00 door frank
Anders moet je alle informatie ophalen en in togglebare div's zetten, zoals je nu ongeveer hebt.
Voordeel van AJAX is dat je informatie pas ophaalt als dat nodig is. Als je eerst alle informatie uit een database gaat ophalen, waar je eigenlijk maar 1/3 van nodig hebt, is dat zonde van de resources.