Hier im Forum bekommt ihr bei euren fragen schnelle hilfe.Hier geht es rund um das Web SeitenProgrammieren.Alles rund ums Javascript,Html,Php,Css und Sql.Auf fast allen Fragen haben wir eine Antwort.
Der Soforthilfe-chat verspricht das ,was sein Name sagt. Hier sind Leute Online die sofort ihre hilfe anbieten.Seht in der OnlineListe nach und wenn einer Online ist werdet ihr auch antwort bekommen. Admine ,Moderatoren und Helfer sind unsere Spezialisten in Sachen Web Programierung
71 Unwetterwarnungen in Deutschland
Die Datenbank wurde zuletzt am 02.08.2020 17:34:28 aktualiesiert
71

Video-Tutorial: HTML-Listen per jQuery UI sortierbar machen

Im Video-Tutorial Einfacher AJAX-Request mit Hilfe von jQuery hatten wir bereits das beliebte Javascript-Framework im Einsatz. Heute ist es natürlich wieder mit an Bord, wenn auch die Erweiterung jQuery UI das eigentliche Objekt unserer Begierde ist.

Im heutigen Tutorial soll es darum gehen, eine einfache unformatierte HTML-Liste (<ul><li></li></ul>) für den Benutzer sortierbar zu machen. Das bedeutet, die Einträge bleiben nicht in ihrer ursprünglichen Sortierung erhalten, sondern der Nutzer kann das letzte Element an die erste Position schieben und umgekehrt. Für dieses Vorhaben greifen wir auf die jQuery UI – Funktion sortable() zurück.

Nach der Sortierung möchten wir die neue Reihenfolge zusätzlich noch in einem span-Element ausgeben, wofür uns die jQuery – Funktion each() zur Verfügung steht. Wer aufgepasst und sich die AJAX Total Artikelserie durchgelesen hat, wird auch leicht rausfinden, wie man die Sortierung per AJAX an eine PHP-Datei schickt und dann in einer Datenbank abspeichert. Falls ich mich da täusche und Bedarf an einer Erweiterung dieses Video-Tutorials besteht, lasst es mich wissen.

Diesmal konnte ich das Video (da kürzer als 15 Minuten) wieder auf Youtube hochladen. Wie immer empfehle ich das Betrachten der 1080p-Variante. Viel Spaß :)

Der Quellcode der index.html

Auch den finalen, vollständigen Quellcode möchte ich euch natürlich nicht vorenthalten.