2012-02-21 21 views
5

यहाँ मेरी कोड है:एक क्लिक के बाद एक सबमिट बटन को अक्षम करने

<form name='frm' id='frm' action='load.asp' method='post' onSubmit='return OnSubmit(this)' style='margin-top:15px'> 
    <input type='submit' name='send' id='send' onclick="this.disabled=true;return true;" value='Send' title='test'> 
</form> 

मैं चाहता हूँ मेरी ऑनसबमिट समारोह निष्पादित किया जाना है और मैं पेज सबमिट करना चाहते हैं। मेरी वेबसाइट में, कोई सबमिट करें और कोई समारोह

मैं इसे यहाँ नकल करने की कोशिश की है, लेकिन रूप तैनात किया जाना है और मेरे समारोह निष्पादित हो जाता है कभी नहीं लगता है ... http://jsfiddle.net/V7B3T/1/

और मुझे नहीं पता मुझे पता है कि मुझे बटन को पुनः सक्रिय करना चाहिए।

क्या मुझे इसे दस्तावेज़ में पहले से ही करना चाहिए, या ऑनसमेट फ़ंक्शन में?

तो अगर कोई पहेली को ठीक कर सकता है :) और उसके बाद मैं इसे अपने कोड से तुलना करूंगा। मुझे लगता है कि: एस मैं हार रहा हूँ

धन्यवाद सभी

उत्तर

14

आप प्रपत्र को मान्य या किसी भी परिवर्तन से पहले प्रस्तुत करने और केवल प्रस्तुत करता है, तो विधि मान्य आप कुछ इस तरह कर सकते हैं बनाना चाहते हैं:

<form id="frm" action="load.asp" method="post" enctype="multipart/form-data"> 
    <input type="submit" name="send" id="send" value="Send" title="test"> 
</form> 

और जावा स्क्रिप्ट कोड:

$('#frm').bind('submit', function (e) { 
    var button = $('#send'); 

    // Disable the submit button while evaluating if the form should be submitted 
    button.prop('disabled', true); 

    var valid = true;  

    // Do stuff (validations, etc) here and set 
    // "valid" to false if the validation fails 

    if (!valid) { 
     // Prevent form from submitting if validation failed 
     e.preventDefault(); 

     // Reactivate the button if the form was not submitted 
     button.prop('disabled', false); 
    } 
}); 

यहां एक काम कर रहे fiddle है।

+0

बिल्कुल मुझे जो चाहिए, बहुत धन्यवाद – GregM

0

आप पेज प्रस्तुत करने के लिए इस चाल करना चाहिए नहीं करना चाहते हैं:

onclick="this.disabled=true;return false;" 
+0

क्षमा करें मेरा प्रश्न गड़बड़ है, मैं पेज सबमिट करना चाहता हूं और मैं चाहता हूं कि ऑनसमेट फ़ंक्शन निष्पादित किया जाए – GregM

4

मैं निश्चित रूप से है कि कोड बाहरी करने के लिए कदम होगा जे एस (और सीएसएस) फ़ाइलें जहां से वह संबंधित है, लेकिन यह काम करना चाहिए:

onclick="this.disabled=true;this.parentNode.submit();" 

आप अक्षम कर रहे हैं के बाद से प्रस्तुत बटन onclick यह एक बार वास्तविक रूप submissi अक्षम कर दिया जाएगा क्लिक पर होता है (उस पर क्लिक करें)। जेएस के साथ फॉर्म जमा करने के बावजूद चाल चलनी चाहिए।

http://jsfiddle.net/V7B3T/4/

संपादित करें: के बारे में फिर से सक्रिय करने के लिए बटन, अपने OnSubmit() समारोह मुझे लगता है कि समाप्त हो गया है के बाद क्या करना होगा।

+0

धन्यवाद, मैंने इसे करने की कोशिश की, लेकिन इसके साथ मेरा ऑनसमेट फ़ंक्शन निष्पादित नहीं किया गया – GregM

+0

ठीक है, फिर बस चलाएं फॉर्म सबमिट करने के बजाय आपका 'ऑन सबमिट()' फ़ंक्शन: 'onclick = "this.disabled = true; ऑनसमेट (this.parentNode);' – powerbuoy

+0

अब तक का सबसे छोटा और सरल समाधान। धन्यवाद! –

5

यदि आपका फॉर्म वास्तव में एक पोस्टबैक करता है, तो आप प्रभावी रूप से पृष्ठ बदल रहे हैं, और इसलिए आपके बटन को फिर से सक्षम करने के बारे में चिंता करने की आवश्यकता नहीं होगी (यह पृष्ठ लोड होने के बाद होगा)।

इसके अतिरिक्त, क्योंकि आप jQuery का उपयोग कर रहे हैं, तो आप भी इसे ठीक से उपयोग और jQuery कार्यों का उपयोग कर ईवेंट हैंडलर्स संलग्न द्वारा अपने HTML मार्कअप और जावास्क्रिप्ट को अलग कर सकते हैं और नहीं onclick, onsubmit, आदि HTML तत्वों पर जिम्मेदार बताते हैं।

अपडेट किए गए HTML:

<form name='frm' id='frm' action='http://jsfiddle.net/' enctype='multipart/form-data' method='post' style='margin-top:15px'> 
    <input type='submit' name='send' id='send' value='Send' title='test'> 
</form> 

जावास्क्रिप्ट अपडेट किया गया:

function submitForm(form) { 
    alert("submitted"); 
} 

$('#send').click(function(e) { 
    this.disabled = true; 
}); 

$('#frm').submit(function(e) { 
    submitForm(this);  
}); 

Working jsFiddle

आप रैप करने के लिए है कि एक वास्तविक पृष्ठ पर प्रयोग के लिए एक $(document).ready(function() {...}); कॉल में की आवश्यकता होगी - मैं इसे छोड़ दिया बाहर क्योंकि jsFiddle किसी दिए गए जावास्क्रिप्ट ऑनलोड को वैसे भी निष्पादित करता है।

+0

नवीनतम पर काम नहीं करता है क्रोम। ऐसा लगता है कि अक्षम करने वाला बटन फॉर्म सबमिशन को रोकता है। – jmarceli

+0

@jmarceli हाँ, ऐसा लगता है कि उन्होंने कुछ बदल दिया है। मुझे आश्चर्य है कि यह जानबूझकर है ... –

 संबंधित मुद्दे

  • कोई संबंधित समस्या नहीं^_^