✔ Gästebuchbeitrag ausklappen

_root · 9. August 2005

Wie realisiere ich folgendes.

Bild:

Wenn ich auf das Plus klicke soll der Beitrag angezeigt werden.

Hier der Code vom Gästebuch:

PHP:

<?php
if ($senden)
{
	if (!$name) { echo "Sie haben keinen Namen angegeben!"; }
	elseif (!$nachricht) { echo "Sie haben keine Nachricht eingegeben!"; }
	else
	{
	    $id = time();
		$db = mysql_connect("127.0.0.1", "user", "passwd");
		mysql_select_db("database",$db);
		$sql = "INSERT INTO hsh_gaestebuch (id,name,email,homepage,ueberschrift,nachricht) VALUES ('$id','$name','$email','$homepage','$ueberschrift','$nachricht')";
		$result = mysql_query($sql,$db);
		echo "<span class='text'>Ihr Daten wurden abgeschickt! Vielen Dank!<br><br>";
	}
}
else
{
?>

<form name="form1" method="post" action="">
  <table width="100%" border="0">
    <tr>
      <td class="text2" width="40%"><div align="right">Name:</div></td>
      <td width="60%"><input name="name" type="text" class="text2" id="name" size="25"></td>
    </tr>
    <tr>
      <td class="text2"><div align="right">email:</div></td>
      <td><input name="email" type="text" class="text2" id="email" size="25"></td>
    </tr>
    <tr>
      <td class="text2"><div align="right">Homepage:</div></td>
      <td><input name="homepage" type="text" class="text2" id="homepage" size="25"></td>
    </tr>
    <tr>
      <td class="text2"><div align="right">&Uuml;berschrift:</div></td>
      <td><input name="ueberschrift" type="text" class="text2" id="ueberschrift" size="25" maxlength="55"></td>
    </tr>
    <tr>
      <td valign="top" class="text2"><div align="right">Nachricht:</div></td>
      <td><textarea name="nachricht" cols="40" rows="6" class="text2" id="nachricht"></textarea></td>
    </tr>
    <tr>
      <td class="text2"><div align="right"></div></td>
      <td><input name="senden" type="submit" class="text2" value="senden">
      <input name="reset" type="reset" class="text2" value="Zur&uuml;cksetzen"></td>
    </tr>
  </table>
</form>
<?
}

?>


<table width="100%" border="0" class="text2">
	<tr>
		<td width="3%">&nbsp;</td>
		<td width="49%">Beitrag:</td>
		<td width="15%">am</td>
		<td width="33%">Von:</td>
  	</tr>
</table>
<? 
$db = mysql_connect("127.0.0.1","user", "passwd");
mysql_select_db("database",$db);
$result = mysql_query("SELECT * FROM hsh_gaestebuch",$db);
?>
<? while ($daten = mysql_fetch_array($result)) {  ?>
<table width="100%" border="0" class="text2">
	<tr>
		<td width="3%"><div align="center"><img src="bilder/plus.jpg" width="9" height="9"></div></td>
		<td width="49%"><? echo $daten[ueberschrift] ?></td>
		<td width="15%"><? echo(date("d.m.Y - H:i",$daten['id'])); ?></td>
		<td width="33%"><? echo $daten[name]; ?></td>
	</tr>
</table>

<? } ?>

MfG aCid

forsterm · 9. August 2005

Hallo,
folgendes Javascript ermöglicht dein Vorhaben.

Code:

/* ************************************************************** *
* Funktion zum Ein- bzw. Ausblenden eines Elements			 *
* Parameter:													 *
* strDivID - ID des Elementes, das ein-/ausgeblendet werden soll *
* objImg - Objekt des Bildes, das gewechselt werden soll	 *
* ************************************************************** */
function toggleDiv(strDivID, objImg){
var myObj = document.getElementById(strDivID);
// Falls der Container eingeblendet werden soll
if(myObj.style.display == "none"){
	// Container einblenden
	myObj.style.display = "block";
	// Bild wechseln
	objImg.src = "up.gif";
}else{
	// Container ausblenden
	myObj.style.display = "none";
	// Bild wechseln
	objImg.src = "down.gif";
}
}

Hier noch ein Beispiel:

Code:

<html>
<head>
<script type="text/javascript">
/* ************************************************************** *
* Funktion zum Ein- bzw. Ausblenden eines Elements			 *
* Parameter:													 *
* strDivID - ID des Elementes, das ein-/ausgeblendet werden soll *
* objImg - Objekt des Bildes, das gewechselt werden soll	 *
* ************************************************************** */
function toggleDiv(strDivID, objImg){
var myObj = document.getElementById(strDivID);
// Falls der Container eingeblendet werden soll
if(myObj.style.display == "none"){
	// Container einblenden
	myObj.style.display = "block";
	// Bild wechseln
	objImg.src = "up.gif";
}else{
	// Container ausblenden
	myObj.style.display = "none";
	// Bild wechseln
	objImg.src = "down.gif";
}
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Ein- bzw. Ausblenden eines Elements</title>
</head>
 
<body>
<div>
    <div style="height: 25px; width: 250px; background: #0080FF; padding: 3px; border: 1px solid #4F4F4F;">
        <img onclick="toggleDiv('divID_1', this)" id="imgID_1" style="float: right;" src="down.gif" width="14" height="14" alt="" />
Überschrift
    </div>
    <div id="divID_1" style="display: none; width: 250px; background: #efefef; padding: 3px; border: 1px solid #4F4F4F; border-top-width: 0;">
        - Inhalt 1<br />
        - Inhalt 2<br />
    </div>
</div>
</body>
 
</html>

mfg
forsterm

_root · 9. August 2005

Das is an sich schonmal echt gut. Nur habe ich ein Problem. Ich weiss nicht wie ich das jetzt in das Gästebuch verschachteln muss.

Weiss da vielleicht jemand hilfe?

MfG aCid

forsterm · 9. August 2005

Hallo,
so vielleicht:

Code:

<html>
<head>
<script type="text/javascript">
/* ************************************************************** *
* Funktion zum Ein- bzw. Ausblenden eines Elements	*
* Parameter:			 *
* strDivID - ID des Elementes, das ein-/ausgeblendet werden soll *
* objImg - Objekt des Bildes, das gewechselt werden soll *
* ************************************************************** */
function toggleDiv(strDivID, objImg){
var myObj = document.getElementById(strDivID);
// Falls der Container eingeblendet werden soll
if(myObj.style.display == "none"){
// Container einblenden
myObj.style.display = "block";
// Bild wechseln
objImg.src = "minus.gif";
}else{
// Container ausblenden
myObj.style.display = "none";
// Bild wechseln
objImg.src = "plus.gif";
}
}
</script>
</head>
<body>
<?php 
if ($senden) 
{ 
	if (!$name) { echo "Sie haben keinen Namen angegeben!"; } 
	elseif (!$nachricht) { echo "Sie haben keine Nachricht eingegeben!"; } 
	else 
	{ 
		$id = time(); 
		$db = mysql_connect("127.0.0.1", "user", "passwd"); 
		mysql_select_db("database",$db); 
		$sql = "INSERT INTO hsh_gaestebuch (id,name,email,homepage,ueberschrift,nachricht) VALUES ('$id','$name','$email','$homepage','$ueberschrift','$nachricht')"; 
		$result = mysql_query($sql,$db); 
		echo "<span class='text'>Ihr Daten wurden abgeschickt! Vielen Dank!<br><br>"; 
	} 
} 
else 
{ 
?> 
<form name="form1" method="post" action=""> 
<table width="100%" border="0"> 
	<tr> 
	 <td class="text2" width="40%"><div align="right">Name:</div></td> 
	 <td width="60%"><input name="name" type="text" class="text2" id="name" size="25"></td> 
	</tr> 
	<tr> 
	 <td class="text2"><div align="right">email:</div></td> 
	 <td><input name="email" type="text" class="text2" id="email" size="25"></td> 
	</tr> 
	<tr> 
	 <td class="text2"><div align="right">Homepage:</div></td> 
	 <td><input name="homepage" type="text" class="text2" id="homepage" size="25"></td> 
	</tr> 
	<tr> 
	 <td class="text2"><div align="right">&Uuml;berschrift:</div></td> 
	 <td><input name="ueberschrift" type="text" class="text2" id="ueberschrift" size="25" maxlength="55"></td> 
	</tr> 
	<tr> 
	 <td valign="top" class="text2"><div align="right">Nachricht:</div></td> 
	 <td><textarea name="nachricht" cols="40" rows="6" class="text2" id="nachricht"></textarea></td> 
	</tr> 
	<tr> 
	 <td class="text2"><div align="right"></div></td> 
	 <td><input name="senden" type="submit" class="text2" value="senden"> 
	 <input name="reset" type="reset" class="text2" value="Zur&uuml;cksetzen"></td> 
	</tr> 
</table> 
</form> 
<? 
} 
 
?> 
 
 
<table width="100%" border="0" class="text2"> 
	<tr> 
		<td width="3%">&nbsp;</td> 
		<td width="49%">Beitrag:</td> 
		<td width="15%">am</td> 
		<td width="33%">Von:</td> 
	 </tr> 
</table> 
<? 
$db = mysql_connect("127.0.0.1","user", "passwd"); 
mysql_select_db("database",$db); 
$result = mysql_query("SELECT * FROM hsh_gaestebuch",$db); 
?> 
<? while ($daten = mysql_fetch_array($result)) { ?> 
<table width="100%" border="0" class="text2"> 
	<tr> 
		<td width="3%"><div align="center">
<img onclick="toggleDiv('divID1', this)" id="imgID1" src="plus.gif" width="16" height="16"></div></td> 
		<td width="49%"><? echo $daten[ueberschrift] ?></td> 
		<td width="15%"><? echo(date("d.m.Y - H:i",$daten['id'])); ?></td> 
		<td width="33%"><? echo $daten[name]; ?></td> 
	</tr>
	<tr >
	 <td id="divID1" style="display: none;" colspan="4">Inhalt</td>
	</tr>
</table>
</body>
</html>
<? } ?>

Du musst nur darauf achten, dass die divID und die imgID immer um eins erhöht wird.

mfg
forsterm

_root · 9. August 2005

Also ... ich brauch jetzt nochmal hilfe von Anfang an ...

Ich habe das Gästebuch (siehe oben) und das Java - Script. Wie vereine ich die beiden?

die daten in der MySQL Tabelle sind folgende:

Code:

$daten[id] (aus der zeit generiert)
$daten[name]
$daten[email] (erstmal unwichtig)
$daten[homepage] (erstmal unwichtig)
$daten[ueberschrift]
$daten[nachricht]

Wenn ich jetzt auf das Plus drücke soll unter der Überschrift hat die Nahricht erscheinen.

Kriegs einfach nicht hin das es für mehrere Einträge funktioniert.
Ich denke mal das man da irgendwas mit der id machen muss .. weiss aber nicht wie ich das hinbekommen soll.

Brauche ganz dringend eure Hilfe =)

MfG aCid

forsterm · 9. August 2005

Code:

<html>
<head>
<script type="text/javascript">
/* ************************************************************** *
* Funktion zum Ein- bzw. Ausblenden eines Elements *
* Parameter:	*
* strDivID - ID des Elementes, das ein-/ausgeblendet werden soll *
* objImg - Objekt des Bildes, das gewechselt werden soll *
* ************************************************************** */
function toggleDiv(strDivID, objImg){
var myObj = document.getElementById(strDivID);
// Falls der Container eingeblendet werden soll
if(myObj.style.display == "none"){
// Container einblenden
myObj.style.display = "block";
// Bild wechseln
objImg.src = "minus.gif";
}else{
// Container ausblenden
myObj.style.display = "none";
// Bild wechseln
objImg.src = "plus.gif";
}
}
</script>
</head>
<body>
<?php 
if ($senden) 
{ 
if (!$name) { echo "Sie haben keinen Namen angegeben!"; } 
elseif (!$nachricht) { echo "Sie haben keine Nachricht eingegeben!"; } 
else 
{ 
$id = time(); 
$db = mysql_connect("127.0.0.1", "user", "passwd"); 
mysql_select_db("database",$db); 
$sql = "INSERT INTO hsh_gaestebuch (id,name,email,homepage,ueberschrift,nachricht) VALUES ('$id','$name','$email','$homepage','$ueberschrift','$nachricht')"; 
$result = mysql_query($sql,$db); 
echo "<span class='text'>Ihr Daten wurden abgeschickt! Vielen Dank!<br><br>"; 
} 
} 
else 
{ 
?> 
<form name="form1" method="post" action=""> 
<table width="100%" border="0"> 
<tr> 
<td class="text2" width="40%"><div align="right">Name:</div></td> 
<td width="60%"><input name="name" type="text" class="text2" id="name" size="25"></td> 
</tr> 
<tr> 
<td class="text2"><div align="right">email:</div></td> 
<td><input name="email" type="text" class="text2" id="email" size="25"></td> 
</tr> 
<tr> 
<td class="text2"><div align="right">Homepage:</div></td> 
<td><input name="homepage" type="text" class="text2" id="homepage" size="25"></td> 
</tr> 
<tr> 
<td class="text2"><div align="right">&Uuml;berschrift:</div></td> 
<td><input name="ueberschrift" type="text" class="text2" id="ueberschrift" size="25" maxlength="55"></td> 
</tr> 
<tr> 
<td valign="top" class="text2"><div align="right">Nachricht:</div></td> 
<td><textarea name="nachricht" cols="40" rows="6" class="text2" id="nachricht"></textarea></td> 
</tr> 
<tr> 
<td class="text2"><div align="right"></div></td> 
<td><input name="senden" type="submit" class="text2" value="senden"> 
<input name="reset" type="reset" class="text2" value="Zur&uuml;cksetzen"></td> 
</tr> 
</table> 
</form> 
<? 
} 
 
?> 
 
 
<table width="100%" border="0" class="text2"> 
<tr> 
<td width="3%">&nbsp;</td> 
<td width="49%">Beitrag:</td> 
<td width="15%">am</td> 
<td width="33%">Von:</td> 
</tr> 
</table> 
<? 
$db = mysql_connect("127.0.0.1","user", "passwd"); 
mysql_select_db("database",$db); 
$result = mysql_query("SELECT * FROM hsh_gaestebuch",$db); 
$i = 0;
?><table width="100%" border="0" class="text2"><?
while ($daten = mysql_fetch_array($result)) { ?> 
<tr> 
<td width="3%"><div align="center"><img onclick="toggleDiv('divID<? echo $i; ?>', this)" id="imgID<? echo $i; ?>" src="plus.gif" width="16" height="16"></div></td> 
<td width="49%"><? echo $daten[ueberschrift] ?></td> 
<td width="15%"><? echo(date("d.m.Y - H:i",$daten['id'])); ?></td> 
<td width="33%"><? echo $daten[name]; ?></td> 
</tr>
<tr >
<td id="divID<? echo $i; ?>" style="display: none;" colspan="4"><? echo $daten[nachricht]; ?></td>
</tr>
<?
$i++;
}
?>
</table>
</body>
</html>

_root · 10. August 2005

edit:

Alles bestens. Danke an alle =)

✔ Gästebuchbeitrag ausklappen

_root

Erfahrenes Mitglied

forsterm

Erfahrenes Mitglied

_root

Erfahrenes Mitglied

forsterm

Erfahrenes Mitglied

_root

Erfahrenes Mitglied

forsterm

Erfahrenes Mitglied

_root

Erfahrenes Mitglied

Neue Beiträge