✔ Persönliche Daten wie bei facebook ändern?

[Kalma]

Hi,


ich würde gerne auf meiner Seite die Daten so (oder so ähnlich) wie bei Facebook ändern lassen.

Also bei Facebook geht das so:
Die Daten werden statisch angezeigt, man klickt auf einen Edit-Button und geladen wird ein komplettes Formular.
Wenn man nun auf Save Changes klickt werden einfach wieder die geänderten Daten angezeigt.

Klar, das geht mit Ajax, nur wie?

Bisher hatte ich nur eine Lösung mit Seitenreload, das gefiel mir aber nicht so.

Ebenso ist soetwas ja praktisch, zum Beispiel für eine Shoutbox:
Man gibt seinen Eintrag ein und die Seite muss nicht neu geladen werden um den Eintrag anzuzeigen.

Kennt ihr ein Tutorial, oder habt ihr selber ein Script indem so etwas behandelt wird?


Gruß und Danke
David

 

[chmee]

Das Ändern ist ja nicht so schwer (Auch wenn ich kein Facebook-User bin und nicht weiß, wie es dort genau gemacht wird, Xing und Flickr bieten so etwas aber auch), nur muss dafür die ganze Seite auch dafür vorbereitet werden.

1. Alle änderbaren Einträge bekommen eine Edit-Funktion, wenn man raufklickt, kann man die Zeile zum Eintragen benutzen.
2. Wenn die Eingabe gemacht wird, wird "lediglich" ein Ajax-Befehl an ein php-script gegeben (in welchem die Daten POST drin stehen)
3. Damit entsteht kein Reload, denn bei Enter (Eingabebestätigung) wird die Ajax-Anweisung abgegeben, bei Erfolg (php-script sagt, es wurde erfolgreich in der DB geändert) bleibt der neue Eintrag stehen, bei Mißerfolg sollte die Fehlermeldung angezeigt werden und der alte Eintrag erscheinen.

Man sollte dafür auf einem Framework aufbauen, wie zB mootools oder jQuery. Und bitte nicht vergessen, dass Sicherheitsmechanismen eingebaut werden müssen.

p.s.: Sowas findet sich im Netz unter Edit-in-place
zB
http://josephscott.org/code/javascript/jquery-edit-in-place/
http://allrite.net/webworld/node/1935
http://www.appelsiini.net/projects/jeditable

mfg chmee

 

[Kalma]

Hi chmee,

danke für deine Antwort!

Da meine Seite noch nichtmal angefangen wurde zu entwickeln ist es kein Problem, jQuery einzubauen, damit habe ich mich schon ein wenig beschäftigt.

Und bitte nicht vergessen, dass Sicherheitsmechanismen eingebaut werden müssen.

Was genau meints du mit Sicherheitsmechanismen?

1. Alle änderbaren Einträge bekommen eine Edit-Funktion, wenn man raufklickt, kann man die Zeile zum Eintragen benutzen.

Wie würdest du das machen?


Gruß und danke
David

 

[chmee]

Sicherheitsmechanismen:
zB darf kein Scriptcode (js oder php oder html-links zB) eingegeben werden (Trojaner-Weiterleitung, code-Injection oder cross-site-injection)
zB darf keine MySQL-Anweisung eingetragen werden (DB-Sicherheitsloch, SQL-Injection)
zB dürfen die Daten nur von Denen verändert werden, die auch die Befugnis haben (Session-Cookies nutzen?)
etc..

Schau Dir mal die Links an, die ich hingepackt habe. Ich denke, damit sollte das Grundsätzliche erklärt sein

mfg chmee

 

[Kalma]

Achso Sowas meinst du mit Sicherheit!
Das ist ja selbstverständlich!


Danke für die Links!
Wenn sich Fragen ergeben sollten werd ich mich noch einmal melden!



Ansonsten danke für die Links!
David

 

[Kalma]

Hi,

ich habe jetzt dieses Tutorial hier probiert:
http://tutorialzine.com/2009/08/creating-a-facebook-like-registration-form-with-jquery/


Was ich mich jetzt frage, wie bau ich das ganze bei Smarty-Templates ein.


Ich habe also die PHP-Datei antstatt "submit.php" register.php genannt, die sieht jetzt wie folgt aus:

	// post fields to check
	$nickname				= trim($_POST['nickname']);
	$password				= trim($_POST['password']);
	$rep_password			= trim($_POST['rep_password']);
	$email					= trim($_POST['email']);
	$sex					= trim($_POST['sex']);


	// we check if everything is filled in
	
	if(empty($nickname) || empty($password) || empty($rep_password) || empty($email))
	{
		die('{status:0,txt:"All the fields are required"}');
	}
	
	
	echo '{status:1,txt: "templates/index.tpl"}';

Dann habe ich eine Form erstelle:

<div id="error">blaa</div>
												
						<form action="register.php" method="post" id="regForm">
							<table border="0" width="100%">
								<tr>
									<td width="40%" align="right">Benutzername:</td>
									<td><input type="text" name="nickname" size="25" class="input" /></td>
								</tr>
								<tr>
									<td align="right">Email Adresse:</td>
									<td><input type="text" name="email" size="25" class="input" /></td>
								</tr>
								<tr>
									<td align="right">Passwort:</td>
									<td><input type="password" name="password" size="25" class="input" /></td>
								</tr>
								<tr>
									<td align="right">Passwort wiederholen:</td>
									<td><input type="password" name="rep_password" size="25" class="input" /></td>
								</tr>
								<tr>
									<td align="right">Geschlecht:</td>
									<td>
										<select name="sex">
											<option name="sex" value="-">bitte auswählen</option>
											<option name="sex" value="1">männlich</option>
											<option name="sex" value="2">weiblich</option>
										</select>
									</td>
								</tr>
							</table>
							
							<br />
							
							<div align="center">
								<input type="submit" name="Anmelden" class="button" />
								<img id="loading" src="{$TPL_IMAGE_DIR}/ajax-loader.gif" alt="working.." />
							</div>
						</form>

Aber ich frage mich, wie krieg ich jetzt hin, dass ich die Meldungen ins Template kriege, so kann es ja eigentlich nicht gehen!

Achja, JS-Dateien habe ich eingebunden

LG
David

 

[Kalma]

Niemand, der mir einen Tipp geben kann?