|
||||
AJAX - Formular erweitern
Hallo allerseits
Ich bin ziemlicher Anfänger was AJAX anbelangt und bin einige Tests am durchführen. Ich schreibe gerade ein Script, das ein Formular, um weitere Felder erweitern soll, sobald der Submit Button gedrückt wird. Dies habe ich mir so gedacht: In meinem Formular gibt es in einem Div versteckte Formularfelder. Sobald der Button gedrückt ist, wird der Inhalt von display:none (CSS) mit "" ersetzt und somit angezeigt. Hier der HTML Code: HTML-Code:
<div> <h1>Extend a Form</h1> <form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post"> <fieldset> <legend>User</legend> <label for="name">Name</label> <input id="name" type="text" name="name" /><br /> <br /> <label for="pass">Pass</label> <input id="pass" type="password" name="pass" /> </fieldset> <div id="extend"> <fieldset style="display:none;"> <legend>Other Information</legend> <label for="oth_inf">This and that</label> <input id="oth_inf" type="text" name="this_that" /> </fieldset> </div> <fieldset> <legend>Submit</legend> <input type="submit" value="Send" name="submitted" onclick="extendform()" /> </fieldset> </form> </div> Code:
function createRequestObject() { // send AJAX Request var objAjax; var browser = navigator.appName; if(browser == "Microsoft Internet Explorer") { objAjax = new ActiveXObject("Microsoft.XMLHTTP"); // Request in IE } else { objAjax = new XMLHttpRequest(); // default Request } return objAjax; } var http = createRequestObject(); function extendform() { var gethtml = document.getElementById("extend").innerHTML; var replace_html; replace_html = gethtml.replace("display:none;", ""); // display form extension http.onreadystatechange = function() { if(http.readyState == 4 && http.status == 200) { alert(document.getElementById('extend').innerHTML); document.getElementById('extend').innerHTML = replace_html; //alert(http.responseText); } } http.open('get', 'nothing.txt'); // fake, don't need that...? http.send(null); } Verstehe auch noch nicht, was der ResponseText (oder Header) bedeuten soll, denn ich anderen Scripts gesehen habe. Brauch ich das? Vielen Dank für eure Hilfe >.< Gruss Toby
__________________
Nyaa~~ ------------------------------------------ http://www.codestyle.ch ------------------------------------------ |
Sponsored Links |
Sponsored Links |
|
||||
Naja, eigentlich möcht ich das schon mit AJAX machen. Soll ja schliesslich eine AJAX übung für mich sein.
Aber du hast recht, ich könnt das auch ohne machen... Geht's denn bei AJAX mehr darum, dass ich nochma ne Datei laden kann (.php o.ä) und dort Datenbank abfragen machen kann und so? Also für alles, was sich in der gleichen Datei abspielt brauch ichs gar nicht?? Gut... Und aber trotzdem würde ich noch gerne wissen, was mein Problem von oben war. Irgendwie muss das ja auch mit Ajax funktionieren?? Ahja zu JQuery: Will jetzt erstma mit JS und AJAX umzugehen lernen. Danach stürze ich mich, wenn ich noch lust habe, möglicherweise noch ins Abenteuer von JQuery ^^ Danke für euere Tipps, Gruss Toby
__________________
Nyaa~~ ------------------------------------------ http://www.codestyle.ch ------------------------------------------ |
|
||||
Nun ja, AJAX mit jQuery ist wesentlich einfacher.
Sieht dann z.B. so aus: Code:
$.ajax({ url: 'ajax/test.html', success: function(data) { $('.result').html(data); alert('Load was performed.'); } }); Bezüglich Deines Problems... wenn einfach nur nach Submit ein DIV sichtbar werden soll wäre das mit jQuery auch sehr einfach zu machen. Es muss im CSS nicht mal display:none; dem DIV zugefügt werden. Z.B. so: Code:
$("#extend").hide(); /* hide #extend */ $("#ID_des_INPUT_BUTTONS").click(function() { $("#extend").show(); /* show #extend });
__________________
XHTML-Valid-Websites.com | CookielessDomain.com | Stop-Supporting-IE6.com if (browser == IE) { sucks(big); } else { nice(site); } Geändert von XHTMLvalid (04.09.2010 um 12:55 Uhr) |
Stichwörter |
ajax, formular |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
PHP mail() formular mit Ajax validieren und abschicken | xml | Javascript & Ajax | 2 | 03.03.2011 21:13 |
Formular dynamisch erweitern | Benutzername | Javascript & Ajax | 2 | 18.02.2011 12:32 |
Ajax: php formular absenden und ergebnisse auf selbe seite in div laden? | sepp88 | Javascript & Ajax | 35 | 23.03.2010 11:17 |
Komplettes Formular mit Ajax senden??? | FeriX | Javascript & Ajax | 7 | 04.07.2009 13:34 |
Ajax Formular mit Weiche? | Zen5656 | Javascript & Ajax | 7 | 04.10.2007 18:28 |