HTTP POST VORM in PHP met behulp van AJAX
Dit voorbeeld toont aan HTTP POST VORM volledige HTML-formulier naar de server en de weergave van de reactie met behulp van AJAX.
HTML-pagina
"text/javascript" > var time_variable ; function getXMLObject ( ) //XML OBJECT { var xmlHttp = false ; try { xmlHttp = new ActiveXObject ( "Msxml2.XMLHTTP" ) // For Old Microsoft Browsers } catch ( e ) { try { xmlHttp = new ActiveXObject ( "Microsoft.XMLHTTP" ) // For Microsoft IE 6.0+ } catch ( e2 ) { xmlHttp = false // No Browser accepts the XMLHTTP Object then false } } if ( ! xmlHttp && typeof XMLHttpRequest != 'undefined' ) { xmlHttp = new XMLHttpRequest ( ) ; //For Mozilla, Opera Browsers } return xmlHttp ; // Mandatory Statement returning the ajax object created } var xmlhttp = new getXMLObject ( ) ; //xmlhttp holds the ajax object function ajaxFunction ( ) { var getdate = new Date ( ) ; //Used to prevent caching during ajax call if ( xmlhttp ) { var txtname = document. getElementById ( "txtname" ) ; xmlhttp. open ( "POST" , "testing.php" , true ) ; //calling testing.php using POST method xmlhttp. onreadystatechange = handleServerResponse ; xmlhttp. setRequestHeader ( 'Content-Type' , 'application/x-www-form-urlencoded' ) ; xmlhttp. send ( "txtname=" + txtname. value ) ; //Posting txtname to PHP File } } function handleServerResponse ( ) { if ( xmlhttp. readyState == 4 ) { if ( xmlhttp. status == 200 ) { document. getElementById ( "message" ) . innerHTML = xmlhttp. responseText ; //Update the HTML Form element } else { alert ( "Error during AJAX call. Please try again" ) ; } } } </ script > <body> <form name="myForm"> <table> <tr> <td>Enter Name</td> <td><input type="text" name="txtname" id="txtname" /></td> </tr> <tr> <td colspan="2"><input type="button" value="Submit" onclick="ajaxFunction();" /></td> </tr> </table> <div id="message" name="message"></div> </form> </body> </head> </html> <html> <head> <title> PHP met behulp van AJAX </ title> <script type = "text / javascript"> var time_variable; functie getXMLObject () / / XML OBJECT (var xmlHttp = false; try (xmlHttp = new ActiveXObject ( "Msxml2.XMLHTTP") / / Voor de oude Microsoft Browsers) catch (e) (try (xmlHttp = new ActiveXObject ("Microsoft.XMLHTTP") / / Voor Microsoft IE 6.0 +) catch (e2) (xmlHttp = false / / nr. browser accepteert het XMLHTTP Object vervolgens valse)) if (! xmlHttp & & typeof XMLHttpRequest! = 'undefined') (xmlHttp = new XMLHttpRequest (); / / Voor Mozilla, Opera Browsers) return xmlHttp; / / Verplicht Verklaring ajax teruggave van het object gemaakt ) var xmlhttp = new getXMLObject (); / / xmlhttp bezit is van het Ajax object ajaxFunction functie () (var getdate = new Date (); / / gebruikt om te voorkomen caching tijdens ajax call if (xmlhttp) (var = txtname document. getElementById ( "txtname"); xmlhttp. open ("post", "testing.php", true); / / testing.php bellen met behulp van POST-methode xmlhttp. onreadystatechange = handleServerResponse; xmlhttp. setRequestHeader ('Content-Type', 'application / x-www-form-urlencoded '); xmlhttp. versturen ("txtname =" + txtname. value); / / Detachering txtname om PHP bestand)) function handleServerResponse () (if (xmlhttp. readyState == 4) (als ( xmlhttp. status == 200) (document. getElementById ("bericht"). innerHTML = xmlhttp. ResponseTekst; / / Werk het HTML-formulier element) else (alert ("Fout tijdens het gesprek AJAX. Probeer het opnieuw");))) </> <body> script <form name="myForm"> <table> <tr> <td> Geef naam </ td> <td> <input type = "text" name = "txtname" id = "txtname" /> </ td> </ tr> <tr> <td colspan="2"> <input type="button" value="Verzenden"> onclick="ajaxFunction();" /> </ td> </ tr > </ table> <div id="message" name="message"> </ div> </ form> </ body> </ head> </ html>
PHP-code
<? $_POST [ 'txtname' ] ; $ A = $ _POST ['txtname']; . $a ; echo "Good Morning". $ a; ?>
Toelichting voor de AJAX-code
Hier heb ik aangegeven 3 JavaScript-functie:
getXMLObject () - Verantwoordelijk voor het creëren van de Ajax object, afhankelijk van de browser
ajaxFunction () - Verantwoordelijk voor het bellen PHP pagina via AJAX call
handleServerResponse () - Verantwoordelijk voor het weergeven van de gegevens van de server opgehaald
Hoe de AJAX-code werkt:
- Wanneer de pagina wordt geladen Ik ben het creëren van een Ajax object door te bellen naar de getXMLObject () functie en terugzending van het object gemaakt in de XMLHTTP variabele
- Wanneer de gebruiker klikt op de knop voor de ingang ajaxFunction () wordt aangeroepen die controleert of de Ajax object wordt gemaakt of niet en afhankelijk van de afstandsbediening dat de oproepen script. Hier een functie handler handleServerResponse is ook gedefinieerd voor het ophalen van de waarde van de server
- Wanneer de readystate van de AJAX call 4 en de HTTP status bereikt is 200 passeren we de gegevens opgehaald van de server naar het tekstveld
Uitleg voor de PHP-code
- Ik roep $ _POST voor het ophalen van de post de inhoud te verzenden via Call Ajax
- Tot slot roep ik echo de reactie terug te sturen naar de oproepende pagina
Custom Search
Populaire artikelen:
- OOPS in PHP 5 Tutorial - Het definiëren van klasse Constanten
- OOPS met PHP 5 handleiding - De Interface
- OOPS in PHP 5 - Polymorphism
- OOPS in PHP 5 Tutorial - abstracte klasse
- OOPS in PHP 5 Tutorial - Exploring Overerving
Goede site die ik "Stumbledupon" het vandaag nog en gaf het een misstap voor je .. zoek uit naar wat anders moet je later ..
Je hebt een goede baan
Nice post, bedankt.
Uitstekende tutorials PAL .... Ik was op zoek dit voor een lange tijd, en uiteindelijk een gevonden!
Bedankt
Dank je wel. Het werkt perfect!
hallo waar is het
Hoe zit het als we meer dan een input?
Hoi,
Ja je kunt doen AJAX call met meer dan een ingang.
Zeggen als u twee tekstvak (textbox1 textbox2 en) in uw HTML-code die moet worden doorgegeven door middel van AJAX dan, de methode te sturen zal hebben volgende gegevens:
xmlhttp.send ("txtname =" + + textbox1.value "& txtname1 =" + textbox2.value);
Bedankt,
Hitesh Agarwal
1000000 keer Dank u wel ... http://www.ghyoom.com/
nice one
Thnk u zelfs zeer Budy ... ... ... ... ... ....
zoet en schoon voorbeeld ... good job!
Hoe zit het als we meer dan een vorm?
In dat geval moet u de gegevens van de formulieren met behulp van JavaScript vastleggen en sturen deze gegevens naar individuele ajax call-methode.
Uitstekende uitleg. Wilde alleen maar even bedanken voor de tijd neemt om te schrijven zeg!