nicht angemeldet
Tabellenkalk
dedlfix
Tabellenkalk
Rolf b
JürgenB
Rolf b
MudGuard
Matthias Apsel
Hallo,
ich sende aus einem jQuery-Overlay (fancybox) ein Formular per Post ab.Dabei wird natürlich die Seite neu geladen und die Daten in der Liste angezeigt. Leider steht die Seite natürlich nach dem Reload natürlich nicht mehr an der Position der Liste vor dem Aufruf des Formulars.
Ich könnte das Formular natürlich mit einem Ajax-Post absenden. Dann erscheint logischerweise aber nicht der neue Eintrag in der Liste.
Ich könnte mit dem Formular per hidden-field die ID der section mitsenden von welcher das Formular (overlay-fancybox) aufgerufen wurde.
Ist es möglich, mit oder ohne jQuery ist egal, nach dem Datenbankeintrag und dem Reload der Seite die ID per scrolling anzusteuern. Die ID kommt per $_POST["sdid"] ja an.
Gruß Rainer
Ich könnte das Formular natürlich mit einem Ajax-Post absenden. Dann erscheint logischerweise aber nicht der neue Eintrag in der Liste.
Unlogisch. Selbstverständlich kannst Du die Response oder Teile davon ins DOM pflanzen ohne die Seite neu zu laden, das ist ja der ganze Sinn von Ajax.
MfG
Beantwortet allerdings nicht meine Frage ob es möglich ist die Position "anzuscrollen" wenn die ID über den POST Request bekannt ist.
Beantwortet allerdings nicht meine Frage ob es möglich ist die Position "anzuscrollen" wenn die ID über den POST Request bekannt ist.
Wenn Du auf der Seite bleibst, kannst Du mit JS hinscrollen wo du wolle. Wenn die Seite jedoch neu ausgeliefert wird, muss der Browser den ganzen Inhalt rendern -- von ganz oben bis ganz unten -- beantwortet das Deine Frage?
MfG
Nein, liegt vielleicht am Wochentag das ich es nicht verstehe?
Bei einem Reload (Location-Header => neuer URL) kannst Du auch ein Fragment anhängen. Probiers doch einfach mal aus. MfG
Es ist eine Liste mit Kunden.
<section id="sp1">
Kundenname/adresse -- Button [Neu] // ruft fancybox mit Form auf
eintrag 1
eintrag 2
.
.
</section>
.
.
.
<section id="sp23">
Kundenname/adresse -- Button [Neu] // ruft fancybox mit Form auf
eintrag 1
eintrag 2
</section>
In der Liste werden alle Kontakte mit Art/Datum/Uhrzeit erfasst. Eine MA sieht darin fällige Kontakte als Wiedervorlage und wird tätig. Nach dem Eintrag des Kontakts muss sie immer wieder an die entsprechende Stelle scrollen um erstens den Eintrag zu prüfen und zweitens den nächsten zu bearbeiten. Das ist lästig und dauert. Deswegen möchte ich nach erfolgtem Eintrga an die Position scrollen wo sie vorher war.
In der Liste werden alle Kontakte mit Art/Datum/Uhrzeit erfasst. Eine MA sieht darin fällige Kontakte als Wiedervorlage und wird tätig. Nach dem Eintrag des Kontakts muss sie immer wieder an die entsprechende Stelle scrollen um erstens den Eintrag zu prüfen und zweitens den nächsten zu bearbeiten. Das ist lästig und dauert. Deswegen möchte ich nach erfolgtem Eintrga an die Position scrollen wo sie vorher war.
Ich mache das anders:
In einer Liste (öffentliches Beispiel) kann ich auf den leeren Bereich einer Position klicken, die wird farbig markiert. Dann rechte Maustaste auf den Link und "in neuem Tab öffnen". Dort Bearbeitung der Position, abschicken und Tab schließen.
Bin wieder in der Liste und kann die nächste Position bearbeiten.
Unten rechts wird die Anzahl der markierten Positionen gezeigt.
Alle paar Stunden kann man die Liste dann neu laden, aber nicht nach jeder Bearbeitung. Bei den nicht-öffentlichen Listen steht oben Datum und Uhrzeit der Ladung.
Linuchs
In der Liste werden alle Kontakte mit Art/Datum/Uhrzeit erfasst. ... muss sie immer wieder an die entsprechende Stelle scrollen um erstens den Eintrag zu prüfen und zweitens den nächsten zu bearbeiten.
Nachfrage:
Welchen Sinn macht es, an die Stelle zu rollen, die nun wegen geänderter Wiedervorlage an einer anderen Position in der Liste steht?
Was ist dann der "nächste" Eintrag? Erfordert der dann doch ein Rollen?
Linuchs
Tach!
Ich könnte das Formular natürlich mit einem Ajax-Post absenden. Dann erscheint logischerweise aber nicht der neue Eintrag in der Liste.
Welche Logik abläuft, legst du mit deiner Programmierung fest. DOM-Manipulation ist keine neue Technik.
Ist es möglich, mit oder ohne jQuery ist egal, nach dem Datenbankeintrag und dem Reload der Seite die ID per scrolling anzusteuern.
Ja klar, du kannst nicht nur dem neuen Eintrag eine Klasse mitgeben, damit du ihn dann farblich gestalten kannst, um den Anwendern das Finden zu erleichtern, du kannst auch einen Anker setzen und anspringen. Auch IDs lassen sich anspringen. Und .scrollIntoView() gibt es auch noch.
dedlfix.
.scrollIntoView() ist wohl noch nicht geeignet da noch "experimentell"
Also gut, nun ganz einfach gefragt: ich möchte beim Laden einer Seite eine bestehende ID anscrollen. Wie mach ich das?
Nicht mehr. Früher musste man mit <a name="4711"> einen Ankerpunkt für seiteninterne Ziele definieren, das ist obsolet. Jedes Tag mit ID reicht. Den Browser positioniert man auf ein Tag mit einer bestimmten ID mittels scrollIntoView - oder wenn Du das nicht willst, dann so:
document.location="#sp17";
Das Hash zu Beginn ist entscheidend, das bewirkt eine intra-page Naviation statt den Abruf einer neuen Seite.
Bzw. wenn Du einen Link erzeugen willst, der auf der Seite "dings.php" direkt zu dem Element mit der ID sp17 springt, rufst Du dings.php#4711 auf.
Wenn Du es ohne Ajax machen willst, kannst Du dein Form ganz normal posten und dann ans Ende der HTML-Seite ein Scriptchen generieren, das so aussieht:
<script>
document.location="#sp17";
// oder: document.getElementById('sp17').scrollIntoView();
</script>
Du kannst dieses Script natürlich auch anderswo ausführen, aber dann musst Du es in einen DOMReady-Handler stecken, sonst funktioniert es nicht.
Rolf
Hallo,
.scrollIntoView() ist wohl noch nicht geeignet da noch "experimentell"
das hätte ich jetzt auch empfohlen. Auch die Unterstützung für das einfache Anspringen reicht: http://caniuse.com/#search=scrollIntoView. Ich verwende es auf einer meiner Seiten und habe bisher noch keine Klagen deswegen bekommen.
Gruß
Jürgen
"Experimentell" - naja , der erste Entwurf des entsprechenden W3C Dokuments wurde 2008 herausgegeben und es ist immer noch im Draft-Status. scrollIntoView ist aber schon seit 2011 drin und wird sogar von Prunkstücken wie dem IE9 unterstützt.
caniuse sagt, dass lediglich Opera Mini diese Funktion nicht unterstützt, was dort aber prinzipbedingt sein kann (serverseitiges pre-rendering).
Rolf
Hi,
Da es ja eh gut ist, Post-Redirect-Get zu machen (damit beim Refresh nicht nachgefragt wird, ob die Daten nochmal gepostet werden sollen), kannst Du die ID an die Redirect-Url per #id anhängen.
cu,
Andreas a/k/a MudGuard
ich sende aus einem jQuery-Overlay (fancybox) ein Formular per Post ab.Dabei wird natürlich die Seite neu geladen und die Daten in der Liste angezeigt. Leider steht die Seite natürlich nach dem Reload natürlich nicht mehr an der Position der Liste vor dem Aufruf des Formulars.
Du kannst die ID des anzuzeigenden Elementes als Anker in die Ziel-URL des Formulars einsetzen: <form method="post" action="verarbeiten.bla#sp23"> zusammen mit <section id="sp23">
Ist die neue ID nicht bekannt oder, was ich beachtenswert finde, möchtest du vermeiden, dass der Nutzer auf der per POST abgerufenen Verarbeitungs-URL rumfuhrwerkt (und bei Neuladen oder Zurückgehen unnötige "Sollen die Formulardaten erneut gesendet werden?"-Rückfragen beantworten muss, geschweige denn, einen Eintrag doppelt anlegt), dann sollte dein Skript statt der neuen Seite lieber eine Weiterleitung 303 an die Ziel-URL ausgeben.
303 ist extra gedacht, um nach dem Verarbeiten von POST-Anfragen auf eine Nicht-POST-Seite weiterzuleiten; das Ziel der Weiterleitung wird per GET abgerufen. Das kann auch dieselbe URL sein, der Punkt ist, dass die URL im Browser nicht mit POST vermerkt ist und besagte Unbequemlichkeiten vermieden werden.
Und bei der Gelegenheit kannst du natürlich auch gleich die gewünschten ID in der Seite ansteuern lassen, denn die ist dir ja spätestens nach der POST-Verarbeitung bekannt und kann als Weiterleitungsziel einbezogen werden.
Ich könnte das Formular natürlich mit einem Ajax-Post absenden. Dann erscheint logischerweise aber nicht der neue Eintrag in der Liste.
Du kannst das verarbeitende Skript nur den HTML-Code für den neuen Eintrag mitgeben und ihn per appendChild in die bestehende Seite einfügen. Du sparst damit ein komplettes Neuladen der Seite, andererseits ist der Programmieraufwand eventuell etwas höher als beim bloßen Absetzen einer 303-Weiterleitung mit Anker-URL.
Du kannst die ID des anzuzeigenden Elementes als Anker in die Ziel-URL des Formulars einsetzen: <form method="post" action="verarbeiten.bla#sp23">
Kannst machen, aber es ist unsinnig, weil das Fragment beim Server gar nicht ankommt. Du kannst es aber anderweitig, z.B. als Parameter zum Server senden und in einen Location-Header einbauen wie ich bereits hier schrieb. MfG
Du kannst die ID des anzuzeigenden Elementes als Anker in die Ziel-URL des Formulars einsetzen: <form method="post" action="verarbeiten.bla#sp23">
Kannst machen, aber es ist unsinnig, weil das Fragment beim Server gar nicht ankommt.
Was soll es denn bitte beim Server? Der Browser soll das Element anspringen, nicht der Server. Und ja, das macht der Browser, probiere es aus.
Also nochmal: Ich schrieb, dass das Fragement, so wie Du das im action-Attribut notiert hast, nicht zum Server übertragen wird.
Ein Fragment kann Bestandteil eines URI sein, hat jedoch im Request keinen Bestand. Davon kannst Du Dich z.b. auch hier überzeugen, dass das Fragment nicht in die Serverumgebung (CGI/1.l) gesetzt wird.
Und nein, ich habs da auch nicht rausgelöscht 😉
Also nochmal: Ich schrieb, dass das Fragement, so wie Du das im action-Attribut notiert hast, nicht zum Server übertragen wird.
Also nochmal: Das ist völlig egal, weil es da überhaupt nicht gebraucht wird.
Die Frage lautete, wie man den Browser dazu bringt, eine bestimmte Stelle der Zielseite anzuzeigen, und nicht, wie irgendwas zum Server übermittelt wird. Dein Hinweis ist für die Fragestellung überflüssig.
Also nochmal: Das ist völlig egal, weil es da überhaupt nicht gebraucht wird.
Also hast Du es ja doch verstanden.
Die Frage lautete, wie man den Browser dazu bringt, eine bestimmte Stelle der Zielseite anzuzeigen
Siehe mein Beitrag von 8:33
und nicht, wie irgendwas zum Server übermittelt wird.
Du wolltest ein Fragment im action-Attribut via Post an den Server übermitteln. Deswegen hielt ich es für meine Pflicht nicht nur zu behaupten dass das nicht geht sondern auch zu erklären warum. MfG
Hallo pl,
Du wolltest ein Fragment im action-Attribut via Post an den Server übermitteln. Deswegen hielt ich es für meine Pflicht nicht nur zu behaupten dass das nicht geht sondern auch zu erklären warum. MfG
Es funktioniert aber wunschgemäß.
<!DOCTYPE HTML>
<html lang="de">
<head>
<meta charset="utf-8">
<title>Fragmente</title>
<style>
#foo {margin-top: 40em;}
</style>
</head>
<body>
<form action="#foo" method="post">
<button>senden</button>
</form>
<p id="foo">foo</p>
</body>
</html>
Bis demnächst
Matthias
Die Frage lautete, wie man den Browser dazu bringt, eine bestimmte Stelle der Zielseite anzuzeigen und nicht, wie irgendwas zum Server übermittelt wird.
Du wolltest ein Fragment im action-Attribut via Post an den Server übermitteln.
Nein, das wollte ich nicht, das hast du mangels Verständnis da hineininterpretiert.
Im action-Attribut wird eine URL angegeben, die der Browser aufruft, nicht mehr, nicht weniger. Wie er sie aufruft, insbesondere welche Teile an den Server übermittelt werden, ist damit nicht gesagt – und ich habe nirgends behauptet und auch nie erwartet, dass das Fragment an den Server übermittelt werden müssre; da ist es nämlich überflüssig, es soll den Browser steuern, nicht den Server.
Es wundert mich doch sehr, dass du mir erklären willst, wie mit dem Fragment umgegangen wird, aber es offenbar selber nicht verstehst.
Da du ja so gerne Beispielseiten bastelst, zum zweiten Mal die Anregung, es selber auszuprobieren. Und damit du nicht wieder irgendwas Unnützes, da völlig am Thema vorbei bastelst:
<html><head><style>
section {
height:400px;
border:1px solid #000;
}
</style></head>
<body>
<div>
<form method="post" action="#sp23"><input name="kunde" value="Dr. Hinkelfurz"><input type="submit" value="Ganz unten neuen Kunden anlegen"></form>
</div>
<section id="sp1">
Frauke Funkelfön
</section>
<section id="sp1">
Griesbert Grummelgelb
</section>
<section id="sp3">
Hilbert Hulbedulch
</section>
<section id="sp23">
<form method="post" action="#sp23"><input name="kunde" value="Dr. Hinkelfurz"><input type="submit" value="Oder auch hier neuen Kunden anlegen"></form>
<?php var_dump($_POST) ?>
</section>
</body></html>
Mit einem Klick auf "Neuen Kunden anlegen" landest du im Zielelement #sp23, wo der im Formular übermittelte Kundenname ausgegeben wird – genau das, was gefragt war.
Die Weiterleitung, die du so gerne haben möchtest, ist für das Ansteuern des Zielelements überflüssig (dass eine 303-Weiterlung einen sehr guten anderen Nutzen hat, schrieb ich bereits).