अजाक्स के माध्यम से कोई फ़ॉर्म सबमिट प्रोटोटाइप का उपयोग कर और एक परिणाम के div अद्यतन

वोट
8

मैं कैसे मैं अजाक्स के माध्यम से कोई फ़ॉर्म सबमिट (प्रोटोटाइप ढांचे का उपयोग) कर सकते हैं और एक परिणाम div में सर्वर प्रतिक्रिया प्रदर्शित सोच रहा हूँ। एचटीएमएल इस तरह दिखता है:

<form id=myForm action=/getResults>
    [...]
    <input type=submit value=submit />
</form>
<div id=result></div>

मैं एक जावास्क्रिप्ट समारोह (जो Ajax.Updater उपयोग करता है) संलग्न करने के लिए करने की कोशिश की करने के लिए ऑनसबमिट इतना (फार्म पर) और onclick (इनपुट पर), लेकिन अभी भी प्रपत्र गैर अजाक्स समारोह समाप्त होने के बाद प्रस्तुत है ( पूरे पृष्ठ परिणामों द्वारा बदल दिया गया है)।

14/01/2009 को 14:05
का स्रोत उपयोगकर्ता
अन्य भाषाओं में...                            


4 जवाब

वोट
3

आप मूल्य ajax समारोह है, जो ब्लॉक मानक प्रपत्र सबमिट से झूठी लौटना ही होगा।

<form id="myForm" onsubmit="return myfunc()" action="/getResults">


function myfunc(){
   ... do prototype ajax stuff...
  return false;

}

प्रपत्र भी पर ऑनसबमिट का उपयोग करते हुए, जो प्रवेश कुंजी के साथ प्रस्तुत उपयोगकर्ताओं कैप्चर करता है।

14/01/2009 को 14:11
का स्रोत उपयोगकर्ता

वोट
3

आप पहली बार करने की जरूरत है अपने रूप को क्रमानुसार , तो एक फोन अजाक्स Updater , का उपयोग कर पोस्ट विकल्प धारावाहिक प्रपत्र डेटा और इसे पारित। परिणाम तो तत्व आप sepcified में दिखाई देगा।

14/01/2009 को 14:16
का स्रोत उपयोगकर्ता

वोट
33

पर प्रोटोटाइप एपीआई पृष्ठों को देखें Form.Requestऔर Eventहैंडलिंग।

मूल रूप से, आप इस अगर:

<form id='myForm'>
.... fields ....
<input type='submit' value='Go'>
</form>
<div id='result'></div>

आपका js कम या ज्यादा हो सकता है,:

Event.observe('myForm', 'submit', function(event) {
    $('myForm').request({
        onFailure: function() { .... },
        onSuccess: function(t) {
            $('result').update(t.responseText);
        }
    });
    Event.stop(event); // stop the form from submitting
});
14/01/2009 को 14:21
का स्रोत उपयोगकर्ता

वोट
0

आप के डिफ़ॉल्ट कार्रवाई को रोकने के लिए की जरूरत है onsubmitघटना।

उदाहरण के लिए:

function submit_handler(e){
    Event.stop(e)
}

पर अधिक जानकारी प्रोटोटाइप में डिफ़ॉल्ट घटना व्यवहार को रोकने »

14/01/2009 को 14:27
का स्रोत उपयोगकर्ता

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more