jQuery सबमिट, मैं कैसे जान सकता हूं कि सबमिट बटन दबाया गया था?

Question

मैं AJAX फ़ॉर्म भेजने के लिए AJAXSubmit प्लगइन का उपयोग कर रहा हूं, लेकिन किसी कारण से यह प्लगइन input[type=image] के नाम/मान नहीं भेजता है। तो अब मैं एजेक्स सबमिट करने से पहले सबमिट घटना को पकड़ रहा हूं, फॉर्म को संभाल लेंगे और मुझे यह जानना होगा कि क्या बटन दबाया जा सकता है?

Answer 1

$("input .button-example").click(function(){ 
//do something with $(this) var 
}); 

पीएस: क्या आपके पास $ var को नियंत्रित करने वाला jQuery है? नहीं तो आप ऐसा करने के लिए है:

jQuery.noConflict(); 
jQuery(document).ready(function(){ 
    jQuery("input .button-example").click(function(){ 
    //do something with jQuery(this) var 
     alert(jQuery(this)); 
    }); 
}); 

आप घटना पर नियंत्रण wan't अगर (प्रपत्र सबमिट)

$(document).ready(function(){ 
    $("#formid").submit(function() { 
      alert('Handler for .submit() called.'); 
      return false; 
    }); 
}); 

मुझे कुछ बताओ अगर यह काम किया;)

Answer 2

यह जो भी इनपुट पकड़ेगा तत्व शुरू की सबमिट करें:

$(document).ready(function() { 
    var target = null; 
    $('#form :input').focus(function() { 
     target = this; 
     alert(target); 
    }); 
    $('#form').submit(function() { 
     alert(target); 
    }); 
}); 

Answer 3

$(document).ready(function() { 
    var clickedVar = null; 
    $('#form :submit').focus(function() { 
     clickedVar = $(this).attr("name"); 
     alert(clickedVar); 
    }); 
}); 

Answer 4

जो कुछ मैंने सोचा है, उसके बारे में मुझे लगता है कि आपके द्वारा किए गए कार्यों को पूरा करने का एक और व्यापक उदाहरण होगा। आप अपने आईडी फार्म के साथ "# अपने फार्म" की जगह और "बटन एक" & "बटन दो" आपके प्रपत्र बटन पर मूल्यों के साथ करना चाहिए।

$(document).ready(function() { 
    var target = null; 
    $('#your-form-id :input').focus(function() { 
    target = $(this).val(); 
    }); 
    $('#your-form-id').submit(function() { 

    if (target == 'Button One') { 
     alert (target); 
    } 
    else if (target == 'Button Two') { 
     alert (target); 
    } 
    }); 
}); 

Answer 5

इस तरह मैंने इसे हल किया। मैं उपरोक्त पोस्ट किए गए कुछ उत्तरों से प्रेरित था लेकिन मुझे एक ऐसे दृष्टिकोण की आवश्यकता थी जो मेरे सभी रूपों के लिए काम करेगी क्योंकि मैंने उन्हें गतिशील रूप से लोड किया था।

मैंने देखा है कि ajaxSubmit एक data विकल्प है जिसके प्लगइन करता है का पालन करते हुए वर्णित किया था:

अतिरिक्त डेटा कि पत्र के साथ प्रस्तुत की जानी चाहिए जिसमें एक वस्तु।

यह वही है जो हमें चाहिए।

तो मैं अपने प्रस्तुत बटन पर क्लिक हैंडलर जुड़ा हुआ है और तत्व jQuery का उपयोग कर (मैं एक नकली विशेषता जोड़ने से इस विधि पसंद करते हैं) को बचाया:

$('[type="submit"]').live('click', function(e){ 
     jQuery.data($(this).parents('form')[0], 'submitTrigger', $(this).attr('name')); 
}); 

और फिर मेरी ajaxSubmit कॉल में मैं डेटा ऑब्जेक्ट बनाया और यह इस तरह भेजा:

function dialogFormSubmit(form) { 
    var data = {} 
    data[jQuery.data(form, 'submitTrigger')] = true; 
    $(form).ajaxSubmit({ 
     data: data 
    }); 
    return false; 
} 

मैं डेटा कि जिस तरह से आपत्ति बनाया क्योंकि मैं के रूप में अगर मैं इसे वेनिला HTML/PHP के साथ प्रस्तुत होता है यह एक ही तरह से व्यवहार करना चाहता था (इनपुट के नाम पर की कुंजी है $ _POST सरणी)। मुझे लगता है कि अगर मैं अपने असली व्यवहार के लिए सच रहना चाहता था तो मैंने सबमिट बटन के मूल्य या आंतरिक HTML को जोड़ा होगा, लेकिन मैं आमतौर पर यह जांचता हूं कि यह सेट है या नहीं, तो यह अनावश्यक था :)।

Answer 6

यह है कि मैं क्या (, दूसरों पर मामूली बदलाव mouseup और ध्यान की बजाय KeyUp घटनाओं का प्रयोग करके) का उपयोग कर रहा है:

var submitButton = undefined; 
$('#your-form-id').find(':submit').live('mouseup keyup',function(){ 
    submitButton = $(this); 
}); 
$('#your-form-id').submit(function() { 
    console.log(submitButton.attr('name')); 
}); 

Answer 7

मैं इस बहुत उपयोगी पाया। इसमें क्लिक करने के मामले को शामिल किया गया है, और टैब इंडेक्स के साथ सबमिट करना और स्थान मारना या प्रवेश करना शामिल है।सबमिट करने से पहले यह अंतिम इनपुट कैप्चर करता है, और यह वह बटन है जो सबमिट किया गया है, इसलिए आपके पास कई बटन हो सकते हैं और कुछ अद्वितीय करने के लिए लक्ष्य के रूप में प्रत्येक को जांच सकते हैं।

$('#form input').live('focusin focusout mouseup', function() { 
    // Add a data attribute to the form and save input as last selected 
    $('#form').data('lastSelected', $(this)); 
}); 
$('#form').submit(function() { 
    var last = $(this).data('lastSelected').get(0); 
    var target = $('#button').get(0); 
    console.log(last); 
    console.log(target); 
    // Verify if last selected was our target button 
    if (last == target) { 
     console.log('bingo'); 
     return false; 
    } 
}); 

Answer 8

हाय उत्तर ने मुझे वैकल्पिक विकल्प लाने के लिए यहां इतना कुछ नहीं समझाया। मैं जो करूँगा वह जेएस द्वारा सत्यापित किया गया है जिसे बटन दबाया गया था।

<head> 
<script> 
$('body').click(function(event) { 
    var log = $('#log'); 
    if($(event.target).is('#btn1')) { 
     log.html(event.target.id + ' was clicked.'); 
     return false; 
    }else{ 
     if($(event.target).is('#btn2')) { 
      log.html(event.target.id + ' was clicked.'); 
      return false; 
       } 
     } 
}); 
</script> 
</head> 
<body> 
    <form id="formulario" method="post"> 
     <div id="log"></div> 
     <input type="submit" id="btn1" value="Btn 01"> 
     <input type="submit" id="btn2" value="Btn 02"> 
    </form> 
</body> 

यह पेज उपयोग परीक्षण Test

Saludos