Ajax verständnis

  • Ajax verständnis

    Kann mir jemand verraten was dieses Skript macht?

    Quellcode

    1. $('#changeDate').parent().children('input').focus(function() { this.select(); }).keydown(function(e) { if(e.keyCode == 13) changeDate(); }); $('#changeDate').click(function() { changeDate(); }); function changeDate() { var error = false; var d = $('#rs_day').val(); if(isNaN(d)) { error = true; $('#rs_day').addClass('error'); } else $('#rs_day').removeClass('error'); var m = $('#rs_month').val(); if(isNaN(m)) { error = true; $('#rs_month').addClass('error'); } else $('#rs_month').removeClass('error'); var y = $('#rs_year').val(); if(isNaN(y)) { error = true; $('#rs_year').addClass('error'); } else $('#rs_year').removeClass('error'); if (!error) { var link = 'bestellung/bestellung.uebersicht.php?orderID=&d='+d+'&m='+m+'&y='+y; if ($.browser.msie) document.location.href = getBaseLink(link); else document.location.href = link; } }



    Wollte eine bestehende Programmierung Ändern und wollte Daten per SEND Button in der Datenbank "Updaten" und hab diesen CODE ^^ in der Programmierung gefunden. Da ich aber habe mit Ajax null am Hut (mir aber evtl. doch nun ein Buch kaufen werde) wäre ich über eine Erklärung über die einzelnen Schritt was das Script macht bzw. aufruft sehr Dankbar.

  • Das hat nichts mit Ajax zu tun, wie kommst du darauf ?

    Das ist JavaScript in Verbindung mit dem Framework jQuery.
    In dem Schnipsel steht 1 Funktion und es werden 3 Events gesetzt.


    Damit du auch ein bisschen gefordert wirst, solltest du den unformatierten Codeschnipsel erstmal in ein sauberes und leserliches Format bringen und den JS Highlighter des Forums nutzen.
    Dann klappt es auch mit dem helfen ;)

  • Erstmals danke vince das du dich meiner annimmst. JAvascript und Ajax also doch zwei Bücher wo ich mir anschaffen sollte. Gibt es da auch was von ratiopharm, Da ich neu hier im Forum unterwegs bin muss ich mich noch an die Funktion gewöhnen aber hier ab ich mal den Code in Form gebracht. Trotzdem versteh ich noch nicht die Funktion bzw. die einzelnen Schritt die hier offensichtlich durchlaufen werden. Aber diese #changeDate muss ja irgendwas auslösen das die Daten in der Datenbank geändert werden.????

    Quellcode

    1. <script type="text/javascript">
    2. $('#changeDate').parent().children('input').focus(function() {
    3. this.select();
    4. }).keydown(function(e) {
    5. if(e.keyCode == 13) changeDate();
    6. });
    7. $('#changeDate').click(function() {
    8. changeDate();
    9. });
    10. function changeDate() {
    11. var error = false;
    13. var d = $('#rs_day').val();
    14. if(isNaN(d)) {
    15. error = true;
    16. $('#rs_day').addClass('error');
    17. }
    18. else $('#rs_day').removeClass('error');
    20. var m = $('#rs_month').val();
    21. if(isNaN(m)) {
    22. error = true;
    23. $('#rs_month').addClass('error');
    24. }
    25. else $('#rs_month').removeClass('error');
    27. var y = $('#rs_year').val();
    28. if(isNaN(y)) {
    29. error = true;
    30. $('#rs_year').addClass('error');
    31. }
    32. else $('#rs_year').removeClass('error');
    35. if (!error) {
    36. var link = 'orders/order.details.php?orderID=<?=$_GET['orderID']?>&d='+d+'&m='+m+'&y='+y;
    37. if ($.browser.msie)
    38. document.location.href = getBaseLink(link);
    39. else
    40. document.location.href = link;
    41. }
    42. }
    43. </script>
    Alles anzeigen


    PS: Buchvorschläge für Ajax und JAvascript sind immer wilkommen

  • jetzt ists auch leserlich ;)

    Wie geschrieben gibt es eine Funktion changeDate() und 3 Event, focus, keydown und click.

    Die changeDate() Funktion prüft ob die Eingaben day,month und year vorhanden, also nicht NaN, sind und fügt ansonsten die Errorklasse hinzu.
    Wenn keine Fehler aufgetreten sind, dann wird auf die angegebene URL weitergeleitet.

    Das ist der Part, den du auch ohne Hilfe & mit deinen bisherigen JS Kenntnissen verstehen solltest.

    Bei den oberen Part wird immer das Element mit der ID(#) changeDate' angesprochen. Die Verkettung "parent().children('input')" bedeutet, das alle Elterelemente angesprochen werden. Davon wiederrum alle Input-Kindelemente. Dort wird das focus Event "angehangen" (bind). Das Event sort dafür, das beim klicken auf das Input-Feld der gesamte Inhalt markiertwird.

    Zusätzlich hängt das KeydownEvent dran, was beim "keycode" 13 die Funktion changeDate aufruft.

    Der 2.Teil ist einfach nur, dass beim klicken die Funktion changeDate aufgerufen wird.


    jQuery Hilfe gibt es hier.
    Ich habe alle Funktionen in dem offiziellen Manual verlinkt, schau dir bitte vorher alle Seiten und vorher Tutorialsan, wenn du weitere Fragen hast.

    Für Buchvorschläge schau einfach mal in die EC Literatur Ecke:
    easy-coding.de/index.php?page=LiteratureOverview