Post Daten versenden mit Ajax

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • Post Daten versenden mit Ajax

    Hallo zusammen,
    ich nutze dieses Script [wiki]AJAX Ladegrafik[/wiki] um eine Ladegrafik anzuzeigen.

    Das Script ist für meine verhältnisse schon etwas modifiziert, da ich manchmal auch mehrere Div's neu laden muss. Hier der Aktuelle Code:

    Quellcode

    1. <script type="text/javascript">
    2. function sendRequest(linkref, target, url,a) {
    3. var loadingImg = document.createElement('img');
    4. loadingImg.className = 'loadingIcon';
    5. linkref.blur();
    6. document.getElementById(target).appendChild(loadingImg);
    7. var req;
    8. try {
    9. req = window.XMLHttpRequest?new XMLHttpRequest():
    10. new ActiveXObject("Microsoft.XMLHTTP");
    11. } catch (e) {
    12. // no AJAX Support
    13. }
    14. req.onreadystatechange = function() {
    15. if ((req.readyState == 4) && (req.status == 200)) {
    16. //document.getElementById(target).removeChild(loadingImg);
    17. document.getElementById(target).innerHTML = req.responseText;
    18. if(a>'') {
    19. for (var i = 1; i <= 5; i++)
    20. if(a==i) {
    21. $('iceMenu_e'+i).addClassName('active');
    22. } else {
    23. $('iceMenu_e'+i).removeClassName('active');
    24. };
    25. }
    26. }
    27. }
    28. req.open('post', url);
    29. req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    30. req.send();
    31. return false; // return false to avoid reload/recentering of the page
    32. }
    33. //-->
    34. </script>
    Alles anzeigen


    Das Script so sowohl für Links die einen Reload auslosen als auch für Formulare gedacht sein. Leider werden beim versenden eines Formulars die Daten nicht mit übergeben. Hier mal ein Testformular:

    Quellcode

    1. <form name="test" action="#" method="post">
    2. <input type="text" name="bla"><br>
    3. <input type="text" name="blubb"><br>
    4. <input type="button" name="send" value="senden" onClick="sendRequest(this, 'kddaten','rand.php','');">
    5. </form>

    Verwende ich einen Submit button wird natürlich die ganze Seite neu geladen.

    Wer kann mir einen Tipp geben wie ich die Formulardaten richtig übertrage.

    MfG
    Boyge
  • Hallo zusammen,

    Danke für eure Antworten, aber nach eifrigem Lesen bin ich zu einer Lösung gekommen. Hier der Code:
    Verwenden tu ich prototype Framework.

    Quellcode

    1. function sendRequest(linkref,target,url,aktiv,gesamt,gruppe,klasse,formular) {
    2. var loadingImg = document.createElement('img');
    3. loadingImg.className = 'loadingIcon';
    4. linkref.blur();
    5. document.getElementById(target).appendChild(loadingImg);
    6. var option = '';
    7. if(formular>'') {
    8. option = $(formular).serialize(true);
    9. }
    10. new Ajax.Updater(target,url,
    11. {
    12. evalScripts: true,
    13. method:'post',
    14. parameters: option,
    15. onComplete: function() {
    16. if(aktiv>'') {
    17. for (var i = 1; i <=gesamt; i++)
    18. if(aktiv==i) {
    19. $(gruppe+i).addClassName(klasse);
    20. } else {
    21. $(gruppe+i).removeClassName(klasse);
    22. };
    23. }
    24. },
    25. onFailure: function(){ document.getElementById(target).innerHTML = 'Something went wrong...'; }
    26. });
    27. return false;
    28. }
    Alles anzeigen


    MfG
    Boyge