मैं मूल फ़ॉर्म का चयन कैसे करूँ जिसके आधार पर सबमिट बटन पर क्लिक किया जाता है?

Question

मेरे पास इस पर 3 रूपों वाला एक वेब पेज है। नेस्टेड नहीं, बस एक के बाद एक (वे लगभग समान हैं, बस एक छिपा हुआ चर जो अलग है)। एक उपयोगकर्ता केवल एक फॉर्म भरता है, और मैं सभी फॉर्मों को केवल एक जेएस स्क्रिप्ट के साथ मान्य / करना चाहूंगा।

तो कैसे, जब कोई उपयोगकर्ता फ़ॉर्म # 1 के सबमिट बटन पर क्लिक करता है, तो क्या मैं अपना js स्क्रिप्ट केवल फॉर्म 1 में फ़ील्ड के साथ व्यवहार करता हूं? मैं इसे $ (इस) .parents के साथ कुछ करने के लिए इकट्ठा करता हूं, लेकिन मुझे यकीन नहीं है कि इसके साथ क्या करना है।

मेरी सत्यापन स्क्रिप्ट (जो मैंने कहीं और इस्तेमाल की थी, केवल एक ही रूप के साथ) ऐसा कुछ दिखता है:

$(document).ready(function(){
    $("#submit").click(function(){
        $(".error").hide();
        var hasError = false;

        var nameVal = $("#name").val();
        if(nameVal == '') {
            $("#name").after('Please enter your name.');
            hasError = true;
        }


        if(hasError == false) {blah blah do all the processing stuff}

तो क्या मुझे $ ("# नाम") जैसी चीजों को बदलने की आवश्यकता है। Val () $ (यह) .parents ('फ़ॉर्म')। Name.val () के साथ? या इस बारे में जाने का एक बेहतर तरीका है?

धन्यवाद!

Answer 1

आप इस तरह से फॉर्म का चयन कर सकते हैं:

$("#submit").click(function(){
    var form = $(this).parents('form:first');
    ...
});

हालाँकि, आमतौर पर इवेंट को फॉर्म के सबमिट इवेंट में संलग्न करना बेहतर होता है, क्योंकि फ़ील्ड में से एक से एंटर की को दबाकर सबमिट करने पर भी यह ट्रिगर हो जाएगा:

$('form#myform1').submit(function(e){
     e.preventDefault(); //Prevent the normal submission action
     var form = this;
     // ... Handle form submission
});

प्रपत्र के अंदर फ़ील्ड का चयन करने के लिए, प्रपत्र संदर्भ का उपयोग करें। उदाहरण के लिए:

$("input[name='somename']",form).val();

Comments

आप सभी इनपुट बच्चों का चयन करने के लिए भी उपयोग कर सकते हैं: $ (यह) .children ()। फ़िल्टर ("इनपुट")

— Pim Jager

या $ ("इनपुट,

— टेक्सारिया

आप var form = $(this).formसामान्य जावास्क्रिप्ट की तरह उपयोग क्यों नहीं कर सकते हैं : function onClick(button) { var form = button.form; } ???

— च्लोए

Answer 2

इनपुट तत्व के रूप को खोजने के लिए खोज करने पर मुझे यह उत्तर मिला। मैं एक नोट जोड़ना चाहता था क्योंकि अब उपयोग करने से बेहतर तरीका है:

var form = $(this).parents('form:first');

मुझे यकीन नहीं है कि जब इसे jQuery में जोड़ा गया था, लेकिन निकटतम () विधि वही करती है जो माता-पिता () का उपयोग करने की तुलना में अधिक सफाई से आवश्यक है। निकटतम कोड के साथ इसे बदला जा सकता है:

var form = $(this).closest('form');

यह पता लगाता है और पहले तत्व को ढूंढता है जो आप के लिए देख रहे हैं और वहां रुक जाता है, जिससे मेल खाता है, इसलिए निर्दिष्ट करने की कोई आवश्यकता नहीं है: पहले।

Answer 3

फॉर्म प्राप्त करने के लिए कि जमा अंदर ही क्यों है

this.form

परिणाम के लिए सबसे आसान और तेज रास्ता।

Comments

jquery के आवरण की आवश्यकता क्यों!

— redsquare

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

— फ्लू

Answer 4

मैं निम्नलिखित विधि का इस्तेमाल किया और यह मेरे लिए ठीक काम किया

$('#mybutton').click(function(){
        clearForm($('#mybutton').closest("form"));
    });

$('#mybutton').closest("form") मेरे लिए चाल चली।

Answer 5

एलीन: नहीं, यह नहीं है var nameVal = form.inputname.val();। यह या तो होना चाहिए ...

jQuery में:

// you can use IDs (easier)

var nameVal =  $(form).find('#id').val();

// or use the [name=Fieldname] to search for the field

var nameVal =  $(form).find('[name=Fieldname]').val();

या जावास्क्रिप्ट में:

var nameVal = this.form.FieldName.value;

या एक संयोजन:

var nameVal = $(this.form.FieldName).val();

JQuery के साथ, आप फॉर्म में मौजूद सभी इनपुट के माध्यम से भी लूप कर सकते हैं:

$(form).find('input, select, textarea').each(function(){

  var name = this.name;
  // OR
  var name = $(this).attr('name');

  var value = this.value;
  // OR
  var value = $(this).val();
  ....
  });