HTML फॉर्म डेटा से JSON ऑब्जेक्ट तैयार करना

वेब विकास के दायरे में, सर्वर पर डेटा को निर्बाध रूप से प्रसारित करना महत्वपूर्ण है। HTML प्रपत्रों से निपटते समय, किसी को JSON प्रारूप में डेटा संप्रेषित करने की आवश्यकता का सामना करना पड़ सकता है। यह आलेख बाधाओं का सामना किए बिना इसे प्राप्त करने के लिए इष्टतम दृष्टिकोण पर प्रकाश डालता है। नाम = "मायफॉर्म"> पहला नाम:लेबल> अंतिम नाम:लेबल>

हमारा उद्देश्य इस फॉर्म से डेटा को JSON ऑब्जेक्ट में बदलना और फॉर्म सबमिट करने पर इसे सर्वर पर प्रसारित करना है।

  First Name:
  
  Last Name:
  
  

फ़ंक्शन सबमिटफ़ॉर्म(){ var xhr = नया XMLHttpRequest(); xhr.open(form.method, form.action, true); xhr.setRequestHeader('सामग्री-प्रकार', 'एप्लिकेशन/json; charset=UTF-8'); वर जे = { "पहला_नाम": "बिंचेन", "अंतिम_नाम": "हेरिस", }; xhr.send(JSON.stringify(j)); }

हालाँकि, एक महत्वपूर्ण दोष के कारण यह दृष्टिकोण कमज़ोर पड़ जाता है। फ़ॉर्म से डेटा पुनर्प्राप्त करने के बजाय, आपने मैन्युअल रूप से एक नमूना JSON ऑब्जेक्ट बनाया है। इसे सुधारने के लिए, हमें फॉर्म डेटा को गतिशील रूप से इकट्ठा करने की आवश्यकता है।

function submitform(){
  var xhr = new XMLHttpRequest();
  xhr.open(form.method, form.action, true);
  xhr.setRequestHeader('Content-Type', 'application/json; charset=UTF-8');
  var j = {
    "first_name":"binchen",
    "last_name":"heris",
  };
  xhr.send(JSON.stringify(j));
}

कोड की यह पंक्ति फॉर्म से सभी डेटा को प्रभावी ढंग से कैप्चर करती है और इसे वांछित JSON में परिवर्तित करती है प्रारूप। फिर आप इस JSON स्ट्रिंग का उपयोग अपने AJAX अनुरोध में कर सकते हैं या, यदि AJAX कोई विकल्प नहीं है, तो इसे एक छिपे हुए टेक्स्ट क्षेत्र में शामिल करें और पारंपरिक रूप से फ़ॉर्म सबमिट करें।

इसके अलावा, यदि आप डेटा को JSON स्ट्रिंग के रूप में प्रसारित कर रहे हैं एक मानक HTML फॉर्म के माध्यम से, ध्यान रखें कि एक सरणी प्रारूप में व्यक्तिगत डेटा बिंदुओं तक पहुंचने के लिए इसे सर्वर साइड पर डिकोड किया जाना चाहिए।

इस दृष्टिकोण का पालन करके, आप आसानी से अपने HTML फॉर्म से JSON ऑब्जेक्ट भेज सकते हैं , निर्बाध डेटा ट्रांसमिशन और कुशल सर्वर संचार सुनिश्चित करना।