सबमिट किए जाने से इनपुट फ़ील्ड को रोकें

Question

मैं कुछ javascript (एक greasemonkey / usercript) लिख रहा हूँ जो एक वेबसाइट पर कुछ इनपुट फील्ड्स को एक फॉर्म में डालेगा।

बात यह है, मैं नहीं चाहता कि उन इनपुट फ़ील्ड्स किसी भी तरह से फॉर्म को प्रभावित करें, मैं नहीं चाहता कि जब फॉर्म सबमिट किया जाए, तो मैं केवल यह चाहता हूं कि मेरी जावास्क्रिप्ट उनके मूल्यों तक पहुंच हो।

क्या कोई तरीका है जो मैं कुछ इनपुट फ़ील्ड को फॉर्म के बीच में जोड़ सकता हूं और फॉर्म सबमिट होने पर उन्हें जमा नहीं किया है?

स्पष्ट रूप से आदर्श बात इनपुट फ़ील्ड के लिए फार्म तत्व में नहीं होगी, लेकिन मैं चाहता हूं कि मेरे परिणामित पृष्ठ का लेआउट मेरे सम्मिलित इनपुट फ़ील्ड को मूल रूप के तत्वों के बीच दिखाई दे।

Comments

यदि उन्हें जमा किया जाता है तो क्या समस्या है? आप सर्वर-साइड भाषा में संसाधित करने के लिए कौन से फ़ील्ड चुन सकते हैं।

— सरफराज

मेरा मानना ​​है कि जब कोई फार्म सबमिट किया जाता है तो अन-नामित फॉर्म तत्व दिखाई देते हैं - यदि आप अपना जेएस लिख सकते हैं तो आईडी द्वारा उन्हें संदर्भित करने के लिए आप उनके नाम खाली छोड़ सकते हैं, प्रभावी रूप से उन्हें सबमिट करने से रोक सकते हैं।

— gddc 17

नाम विशेषता फ़ील्ड को खाली छोड़ दें

— डीस्ट्रोल करें

@ सरफराज अहमद: मैं एक ग्रेज्यमेक स्क्रिप्ट लिख रहा हूं, इसलिए मेरा वेबसाइट पर कोई नियंत्रण नहीं है।

— बलूत का फल

W3 के अनुसार: एक फॉर्म जमा करने में शामिल किया जाना है। फ़ील्ड (फॉर्म एलिमेंट) को फॉर्म एलिमेंट के भीतर परिभाषित किया जाना चाहिए, और एक नाम विशेषता होना चाहिए। नाम के बिना तत्व, या प्रपत्र में निहित नहीं, सर्वर को प्रस्तुत नहीं किया जाता है।

— केनेबेक

Answer 1

आप "नाम" विशेषता के बिना इनपुट फ़ील्ड सम्मिलित कर सकते हैं:

<input type="text" id="in-between" />

या आप फॉर्म (इन jQuery) सबमिट करने के बाद उन्हें केवल निकाल सकते हैं :

$("form").submit(function() {
   $(this).children('#in-between').remove();
});

Comments

नाम को सबमिट करने से इसे सबमिट करने से रोकता है? अच्छा, मुझे नहीं पता था। क्या यह सभी ब्राउज़रों पर काम करता है? क्या यह एक मानक का हिस्सा है, या यह एक कार्यान्वयन क्वर्क है?

— ब्लेयरहिपो

@ मैं पूरी तरह से आश्वस्त नहीं हूँ, लेकिन इसके बारे में पढ़ने लायक है। अनिवार्य रूप से यदि आप "नाम" विशेषता मान को छोड़ देते हैं, तो आप किसी भी विधि के माध्यम से उस मूल्य तक नहीं पहुंच सकते हैं ... इसलिए यह हो सकता है कि मान केवल ब्राउज़र द्वारा त्याग दिया गया हो। यदि यह आपके लिए सुरक्षित होने के लिए महत्वपूर्ण है, तो jquery / javascript विकल्प पर जाएं (बस ध्यान दें कि जब जावास्क्रिप्ट आसानी से निष्क्रिय हो जाए तो फ़ील्ड सबमिट किए जाएंगे - इसलिए उस पर आपके किसी भी सुरक्षा तंत्र पर भरोसा न करें)।

— गल

मैंने क्रोम, फ़ायरफ़ॉक्स, सफारी के साथ नाम विशेषता को छोड़ने का परीक्षण किया और ऐसा लगता है कि नाम के लिए खाली स्ट्रिंग के साथ फॉर्म फ़ील्ड सर्वर को प्रस्तुत किए जा रहे हैं। मैंने WebScarab का उपयोग करके पोस्ट डेटा का निरीक्षण किया और पाया कि डेटा भेजा जा रहा है। अभी के लिए मुझे लगता है कि मुझे उन्हें सबमिट करने से रोकने के लिए फ़ील्ड को अक्षम करना होगा।

— kldavis4

@ kldavis4 - ऐसा लगता है कि दोनों पट्टी (stripe.js) और ब्रेनट्री (braintree.js) [कड़ी] braintreepayments.com/docs/python/guide/getting_paid सर्वर से टकराने रोक आंकड़ों के गुण अवधारणा "बाहर नाम छोड़ने" का उपयोग इस प्रकार "PCI" अनुपालन की आवश्यकता को कम करने ... अगर आप कहते हैं कि "डेटा" भेजा जा रहा है तो क्या वे गलती से हैं?

— राहुल दीघ

यदि प्रपत्र में कोई नाम नहीं है, तो क्या प्रपत्र डेटा अभी भी स्थानांतरित होता है?

— केविन व्हीलर

Answer 2

सबसे आसान बात यह है कि तत्वों को disabledविशेषता के साथ सम्मिलित करना होगा ।

<input type="hidden" name="not_gonna_submit" disabled="disabled" value="invisible" />

इस तरह आप उन्हें अभी भी फ़ॉर्म के बच्चों के रूप में एक्सेस कर सकते हैं।

अक्षम फ़ील्ड में नकारात्मक पहलू यह है कि उपयोगकर्ता उनके साथ बिल्कुल भी बातचीत नहीं कर सकता है - इसलिए यदि आपके पास disabledपाठ फ़ील्ड है, तो उपयोगकर्ता पाठ का चयन नहीं कर सकता है। यदि आपके पास एक disabledचेकबॉक्स है, तो उपयोगकर्ता अपना राज्य नहीं बदल सकता है।

जिन फ़ील्ड को आप सबमिट नहीं करना चाहते, उन्हें निकालने के लिए आप फॉर्म जमा करने के लिए कुछ जावास्क्रिप्ट भी लिख सकते हैं।

Comments

यह विचार मेरे सम्मिलित क्षेत्रों के लिए प्रयोग करने योग्य है ताकि उपयोगकर्ता चेकबॉक्स आदि को बदल सके और फिर उन्हें मेरी जावास्क्रिप्ट में जमा कर सके।

— बलूत का फल

अक्षम तब भी काम कर सकता है, यदि आप केवल फ़ील्ड्स को सबमिट करते हैं या चयनित चेकबॉक्स के आधार पर। इस तरह से आप केवल nameसंपत्ति को फेंक नहीं रहे हैं, जिसे आप बाद में उपयोग करने के लिए चाहते हैं, तो आप इसे पकड़ सकते हैं।

— JMTyler

यह बहुत अच्छा है जब आपको AJAX का उपयोग करके फॉर्म जमा करना होता है और आप फॉर्म से अपने इनपुट को हटाना नहीं चाहते हैं या उनकी nameविशेषता को हटाना नहीं चाहते हैं ।

— नौलोनर

Answer 3

सरल इनपुट तत्व से नाम विशेषता को हटाने का प्रयास करें ।
इसलिए इसे देखना होगा

<input type="checkbox" checked="" id="class_box_2" value="2">

Comments

इसका उत्तर होना चाहिए :))

— Máxima Alekz

यह चेकबॉक्स के लिए काम करता है। ध्यान दें कि यह रेडियो बटन के साथ उपयोग किए जाने पर अन्य रेडियो बटन के स्वचालित विचलन को तोड़ देगा।

— ऐरे

Answer 4

मैं सिर्फ एक अतिरिक्त विकल्प जोड़ना चाहता था: अपने इनपुट में फॉर्म टैग जोड़ें और उस फॉर्म का नाम निर्दिष्ट करें जो आपके पेज पर मौजूद नहीं है:

<input form="fakeForm" type="text" readonly value="random value" />

Comments

जब तक यह संभवत: काम नहीं करता है (परीक्षण नहीं किया गया है), जब तक कि आप वास्तव में fakeFormकहीं और परिभाषित न करें (प्रस्तुत करने की आवश्यकता नहीं) यह परिणाम अवैध HTML में होता है।

— ब्रायन एच।

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

— yanisalexiou

नोट: यह समाधान IE के साथ काम नहीं करता है । चेक यहाँ

— हार्वे

@ हाईवे वाइक! सर उठाने के लिए धन्यवाद!

— जोशुआ पिंटर

Answer 5

आप एक इवेंट हैंडलर लिख सकते हैं, onsubmitजो nameउन सभी इनपुट फ़ील्ड्स से विशेषता को हटा देता है, जिन्हें आप फ़ॉर्म सबमिशन में शामिल नहीं करना चाहते हैं।

यहाँ एक त्वरित अप्रयुक्त उदाहरण है:

var noSubmitElements = [ 'someFormElementID1', 'someFormElementID2' ]; //...
function submitForm() {
    for( var i = 0, j = noSubmitElements.length; i < j; i++ ) {
        document.getElementById(noSubmitElements[i]).removeAttribute('name');
    }
}
form.onsubmit = submitForm;

Answer 6

मुझे पता है कि यह पोस्ट प्राचीन है, लेकिन मैं फिर भी जवाब दूंगा। सबसे आसान / सबसे अच्छा तरीका जो मैंने पाया है वह है बस नाम को खाली करना।

इसे अपनी जमा करने से पहले रखें:

document.getElementById("TheInputsIdHere").name = "";

आपके सभी सबमिट फ़ंक्शन इस तरह दिख सकते हैं:

document.getElementById("TheInputsIdHere").name = "";
document.getElementById("TheFormsIdHere").submit();

यह अभी भी आपके अन्य सभी फ़ील्ड के साथ फ़ॉर्म सबमिट करेगा, लेकिन बिना नाम के कोई भी सबमिट नहीं करेगा।

Comments

सरल और सीधा। मुझें यह पसंद है!

— परबनी

Answer 7

इनपुट में अक्षम = "अक्षम" जोड़ें और जब jquery विशेषता को हटा दे, जब आप इसे उपयोग करना चाहते हैं। .removeAttr ('अक्षम')

HTML:

<input type="hidden" name="test" value="test" disabled='disabled'/>

jQuery:

$("input[name='test']").removeAttr('disabled');

Answer 8

उपरोक्त सभी उत्तरों ने पहले से ही फॉर्म नियंत्रणों का नामकरण (नहीं) के बारे में सब कुछ कहा है या प्रोग्रामेटिक रूप से उन्हें हटाने से पहले वास्तव में अपना फॉर्म सबमिट करने से पहले।

हालाँकि, मेरे शोध के दौरान मुझे एक और समाधान मिला, जिसका मैंने इस पोस्ट में उल्लेख नहीं किया है:
यदि आप उस प्रपत्र नियंत्रण को संक्षिप्त करते हैं जिसे आप अनप्रोसेस्ड होना चाहते हैं / नहीं भेजा गया है, तो <form>बिना किसी methodविशेषता वाले किसी अन्य टैग के अंदर path(और स्पष्ट रूप से कोई सबमिट प्रकार नियंत्रण नहीं है) एक बटन की तरह या इसमें इनपुट नेस्टेड जमा करें), फिर मूल प्रपत्र सबमिट करने से इनकैप्सुलेटेड फॉर्म नियंत्रण शामिल नहीं होंगे।

<form method="POST" path="/path">
  <input type="text" name="sent" value="..." />
  <form>
    <input type="text" name="notSent" value="..." />
  </form>
  <input type="submit" name="submit" value="Submit" />
</form>

[नाम = "नोटसेंट"] नियंत्रण मूल्य संसाधित नहीं किया जाएगा और न ही सर्वर POST समापन बिंदु पर भेजा जाएगा, लेकिन [नाम = "भेजा"] से एक होगा।

यह समाधान एक किस्सा हो सकता है लेकिन मैं अभी भी इसे पोस्टीरिटी के लिए छोड़ रहा हूं ...

Comments

दिलचस्प अवलोकन लेकिन क्या आपने विभिन्न ब्राउज़रों में इसका परीक्षण किया है? मुझे आश्चर्य है कि यह डिजाइन द्वारा, विनिर्देश द्वारा या ब्राउज़र व्यवहार का सिर्फ एक उद्धरण है। क्या यह भविष्य में एक विश्वसनीय तरीका होगा क्योंकि ब्राउज़र बदलते हैं?

— शाम

Answer 9

ऑनसुबमिट () के माध्यम से एक फंक्शन में फॉर्म सबमिट करें और फॉर्म एलिमेंट को हटाने के लिए नीचे जैसा कुछ करें: getElementById()डोम का उपयोग करें , फिर उपयोग करें[object].parentNode.removeChild([object])

मान लें कि आपके क्षेत्र में एक आईडी विशेषता "my_removable_field" कोड है:

var remEl = document.getElementById("my_removable_field");
if ( remEl.parentNode && remEl.parentNode.removeChild ) {
remEl.parentNode.removeChild(remEl);
}

यह आपको वही मिलेगा जो आप ढूंढ रहे हैं।

Answer 10

क्या आपको भी पहली जगह में इनपुट तत्वों की आवश्यकता है? आप जावास्क्रिप्ट का उपयोग गतिशील रूप से divs या पैराग्राफ या सूची आइटम बनाने के लिए कर सकते हैं या जो कुछ भी जानकारी है जिसे आप प्रस्तुत करना चाहते हैं।

लेकिन अगर इंटरएक्टिव तत्व महत्वपूर्ण है और <form>ब्लॉक के बाहर उन तत्वों को रखने के लिए बट में दर्द होता है , तो पृष्ठ सबमिट होने पर उन तत्वों को फॉर्म से निकालना संभव होना चाहिए।

Comments

हां, मुझे इनपुट तत्वों के होने की आवश्यकता है क्योंकि मैं उपयोगकर्ता इनपुट प्राप्त करने की कोशिश कर रहा हूं।

— एकॉर्न

Answer 11

$('#serialize').click(function () {
  $('#out').text(
    $('form').serialize()
  );
});

$('#exclude').change(function () {
  if ($(this).is(':checked')) {
    $('[name=age]').attr('form', 'fake-form-id');
  } else {
    $('[name=age]').removeAttr('form');    
  }
  
  $('#serialize').click();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="/">
  <input type="text" value="John" name="name">
  <input type="number" value="100" name="age">
</form>

<input type="button" value="serialize" id="serialize">
<label for="exclude">  
  <input type="checkbox" value="exclude age" id="exclude">
  exlude age
</label>

<pre id="out"></pre>

Comments

दुर्भाग्य से फॉर्म की विशेषता IE / एज में काम नहीं करती है। caniuse.com/#search=form%20attribute

— जॉर्ज हेलर

Answer 12

आपको अपने फ़ॉर्म में ऑनसाइट सबमिट करने की आवश्यकता है:

<form action="YOUR_URL" method="post" accept-charset="utf-8" onsubmit="return validateRegisterForm();">

और स्क्रिप्ट इस तरह होगी:

        function validateRegisterForm(){
        if(SOMETHING IS WRONG)
        { 
            alert("validation failed");
            event.preventDefault();
            return false;

        }else{
            alert("validations passed");
            return true;
        }
    }

यह मेरे लिए हर काम करता है :)