फार्म PHP में पोस्ट AJAX का प्रयोग

इस उदाहरण के सर्वर को HTTP फार्म पोस्ट पूरी HTML फार्म का दर्शाता है और AJAX का प्रयोग प्रतिक्रिया प्रदर्शित.

HTML पेज

 "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> AJAX का प्रयोग </ शीर्षक> स्क्रिप्ट <= "पाठ / जावास्क्रिप्ट"> var time_variable; समारोह getXMLObject () / / XML वस्तु (var xmlHttp = झूठी प्रकार; xmlHttp (कोशिश = नई ActiveXObject PHP ( "Msxml2.XMLHTTP") / / के लिए पुराने Microsoft ब्राउज़र्स पकड़) (ङ) ((xmlHttp कोशिश = नई ActiveXObject ( "Microsoft.XMLHTTP") / / Microsoft IE 6.0 के लिए +) (e2) xmlHttp (पकड़ = झूठा / नहीं / ब्राउज़र स्वीकार XMLHTTP वस्तु तो नकली)) अगर (! & & typeof xmlHttp XMLHttpRequest! = 'अपरिभाषित') xmlHttp (= नई XMLHttpRequest (); / / मोज़िला के लिए, ओपेरा ब्राउज़र) वापस xmlHttp; / / अनिवार्य AJAX लौट वक्तव्य निर्मित वस्तु xmlhttp) var = नई getXMLObject (); / / xmlhttp AJAX वस्तु समारोह ajaxFunction धारण () (var getdate = नई तिथि (); / / AJAX के लिए फोन के दौरान कैशिंग रोकने में प्रयुक्त अगर (xmlhttp) (var txtname दस्तावेज़ = getElementById. ( "txtname"); xmlhttp. ( "पोस्ट", "testing.php", सच); खुला / / पोस्ट xmlhttp विधि का उपयोग कर testing.php बुला रही. onreadystatechange = handleServerResponse; xmlhttp. setRequestHeader ( 'सामग्री' प्रकार ', application / x-www-फार्म-urlencoded '); xmlhttp. ( "txtname =" txtname + भेजें. मूल्य); / / PHP फाइल)) को txtname पोस्टिंग handleServerResponse समारोह () (अगर (xmlhttp. readyState == 4) (अगर ( xmlhttp. == 200 दर्जा) दस्तावेज (. getElementById ( "संदेश"). innerHTML = xmlhttp. responseText; / / अपडेट HTML फार्म तत्व और) (चेतावनी ( "त्रुटि के दौरान AJAX कहते हैं. कृपया पुन: प्रयास करें");))) </ script> <body> <form name="myForm"> <table> <tr> <td> नाम <td / प्रविष्ट करें> <td> <इनपुट प्रकार = "पाठ" नाम = "txtname" id = "txtname" /> </ td> </ tr> <tr> colspan="2"> <td <input type="button" value="Submit" onclick="ajaxFunction();" /> </> </ tr td > <मेज /> <div id="message" name="message"> </ div> </ फार्म> </ body> </ सिर> html </> 

PHP कोड

  <?

 $_POST [ 'txtname' ] ; $ एक = $ _POST '[' txtname];

 . $a ; प्रतिध्वनि "सुप्रभात." एक $;


 ?> 

आपका ईमेल:

AJAX संहिता के लिए स्पष्टीकरण

यहाँ मैं 3 जावास्क्रिप्ट समारोह की घोषणा की है:
getXMLObject () - ब्राउज़र पर निरभर है AJAX वस्तु बनाने के लिए जिम्मेदार
ajaxFunction () - AJAX फोन के माध्यम से PHP पृष्ठ बुला के लिए जिम्मेदार
handleServerResponse () - सर्वर से प्राप्त डेटा का प्रदर्शन के लिए जिम्मेदार

कैसे AJAX कोड काम करता है:

  • जब पेज लोड मैं getXMLObject बुला समारोह () और xmlhttp चर में निर्मित वस्तु लौटने से एक AJAX वस्तु का निर्माण कर रहा हूँ
  • जब इनपुट बटन पर प्रयोक्ता क्लिकें, ajaxFunction () के लिए कहा जाता है जो कि चेक Ajax वस्तु या नहीं बनाया है और यह है कि दूरदराज के स्क्रिप्ट कॉल के आधार पर हो जाता है. यहाँ एक समारोह हेन्डलर handleServerResponse भी सर्वर से मूल्य पुन: प्राप्त करने के लिए परिभाषित किया गया है
  • जब AJAX फोन के readystate 4 और http स्तर तक पहुँच 200 हम पास डेटा सर्वर से textbox को कौड़ी है

PHP कोड के लिए स्पष्टीकरण

  • मैं Ajax फोन के माध्यम से इस पद के लिए सामग्री भेजने के मोहक _POST $ बुला रहा हूँ
  • अंत में मैं गूंज बुला रहा हूँ प्रतिक्रिया भेज बुला पेज पर वापस

कस्टम खोज


लोकप्रिय आलेख:

Tags: , , श्रेणियाँ: AJAX, PHP टैग:
  1. 5 अप्रैल 2008 06:07 पर | # 1

    अच्छा साइट मैं "Stumbledupon" यह दिया था और आज यह एक तुम .. के लिए ठोकर देख और क्या तुम्हें बाद में है .. आगे देख

  2. रवि
    22 नवम्बर 2008 02:16 पर | # 2

    क्या आप कोई अच्छा काम किया है

  3. mehmet
    , 8 मई, 2009 में 04:13 | # 3

    अच्छी पोस्ट, धन्यवाद.

  4. 22 मई 2009 12:34 पर | # 4

    उत्कृष्ट ट्यूटोरियल दोस्त ... मैं. लंबे समय के लिए यह खोज रहा था, और अंत में एक मिल गया!
    धन्यवाद

  5. Yigit
    , 30 मई, 2009 में 00:49 | # 5

    आपको बहुत बहुत धन्यवाद. यह काम करता है सही!

  6. 23 जून 2009 05:05 पर | # 6

    हाय कहाँ है

  7. के बारे में क्या?
    , 16 अगस्त 2009 को 20:50 | # 7

    के बारे में क्या यदि हम एक और इनपुट से उपयोग करें?

  8. , 18 अगस्त 2009 को 02:45 | # 8

    नमस्ते,
    हाँ, आप एक से अधिक निवेश के साथ AJAX कॉल कर सकते हैं.
    कहते हैं कि अगर आप दो textbox है (textbox1 और textbox2) अपने एचटीएमएल कोड में से है कि जरूरतों को AJAX के माध्यम से पारित हो, विधि डेटा भेजने के बाद ही होगा:
    xmlhttp.send ( "txtname =" + textbox1.value + "& txtname1 =" textbox2.value +);

    धन्यवाद,
    हितेश अग्रवाल

  9. 22 अक्टूबर 2009 21:46 पर | # 9

    1000000 बार धन्यवाद ... http://www.ghyoom.com/

  10. 6 दिसम्बर 2009 10:29 पर | # 10

    अच्छा एक

  11. फ़रवरी 8, 2010 07:04 पर | # 11

    Thnk यू बहुत budy ... ... ... ... ... ....

  12. फ़रवरी 17, 2010 08:53 पर | # 12

    मधुर और स्वच्छ उदाहरण ... अच्छा काम!

  1. अभी तक कोई trackbacks.