Client and Server Side Form Validation
सत्यापन किसी भी वेब एप्लिकेशन का एक अनिवार्य हिस्सा है। लगभग हर वेब एप्लिकेशन में हमें यूजर से डेटा इनपुट करना होता है और अक्सर ऐसा होता है कि हमने उस डेटा के बारे में नहीं सोचा है जो यूजर द्वारा इनपुट किया गया है या हमने उस डेटा को मैनेज करने के लिए एक ही कोड नहीं लिखा है।
- Implement Presentation Logic
- Validate user input data.
- Data format and data range.
वैलिडेशन कंट्रोल की मदद से यह तय किया जाता है कि यूजर को डाटा एंटर करते समय कोई गलती नहीं करनी चाहिए और अगर डाटा को इनपुट करना है तो उस डाटा को ठीक से चेक करने के बाद ही इनपुट किया जाना चाहिए।
Validation control 2 प्रकार के होते हैं
- Client Side Validation.
- Server Side Validation.
Client Side Validation
क्लाइंट साइड सत्यापन में, सत्यापन उपयोगकर्ता के वेब ब्राउज़र स्तर पर किया जाता है। जब क्लाइंट साइड सत्यापन किया जाता है, तो सभी उपयोगकर्ता इनपुट सत्यापन उपयोगकर्ता के ब्राउज़र में स्वचालित रूप से किया जाता है। क्लाइंट साइड सत्यापन सर्वर में सर्वर की कार्यक्षमता की आवश्यकता नहीं होती है। इसलिए यह सर्वर साइड सत्यापन से तेज है, लेकिन कई ऐसे सत्यापन हैं जहां क्लाइंट साइड सत्यापन का उपयोग नहीं किया जा सकता है।
उदाहरण के लिए, हम चाहते हैं कि उपयोगकर्ता नाम हमारे पूरे वेब एप्लिकेशन में अद्वितीय हो, क्योंकि उपयोगकर्ता का डेटा सर्वर पर डेटाबेस में संग्रहीत किया जाएगा, इसलिए इसमें क्लाइंट साइड सत्यापन का उपयोग नहीं किया जा सकता है।
आम तौर पर, क्लाइंट साइड सत्यापन के लिए जावा स्क्रिप्ट (जावास्क्रिप्ट), वीबी स्क्रिप्ट और jQuery का उपयोग किया जाता है।
Server Side Validation
सर्वर साइड वैलिडेशन में, इनपुट उपयोगकर्ता द्वारा सर्वर को भेजा जाता है। इसके लिए सर्वर साइड स्क्रिप्टिंग भाषा का उपयोग किया जाता है जैसे – एएसपी, पीएचपी इत्यादि। सर्वर साइड पर सत्यापन प्रक्रिया के बाद क्लाइंट को फीडबैक वापस कर दिया जाता है।
ASP .NET के अंतर्गत आने वाले server-side validations निम्नलिखित है –
- Required field validation
- Compare validation
- Range validation
- Regular expression validation
- Custom validation
- Validation Summery
1. Required field validation
आवश्यक फ़ील्ड सत्यापन का उपयोग यह निर्धारित करने के लिए किया जाता है कि उपयोगकर्ता द्वारा किसी फ़ील्ड में डेटा दर्ज किया गया है या नहीं। इसका मतलब यह है कि यह नियंत्रण निर्दिष्ट करता है कि उपयोगकर्ता द्वारा फॉर्म जमा करने से पहले फ़ील्ड में मान दर्ज किया गया है। यह सत्यापन नियंत्रण ज्यादातर टेक्स्टबॉक्स के साथ प्रयोग किया जाता है। इस नियंत्रण में कई गुण होते हैं जो इस प्रकार हैं –
| SN | Property | Description |
|---|---|---|
| 1 | ControlToValidate | Specifies the ID of the control that you want to validation. |
| 2 | Text | Sets the error message display by the control. |
| 3 | Display | Sets how the error message content in the text property is displayed, possible values are static dynamic and none the default value is static. |
| 4 | Enable Client Script | Enable and visible client side from validation. This property has the value true by default. |
| 5 | Error Message | Specify the error message that is displayed in the validation summary control this error message is displayed by the validation control when the text property is not set. |
| 6 | Initialvalue | Gets or sets the initial value of the control specified by the control to validate property. |
2. Compare Validation
तुलना सत्यापन नियंत्रण की सहायता से, प्रपत्र के किसी भी क्षेत्र में डेटा मान इनपुट की तुलना किसी अन्य मान से की जाती है। दूसरे शब्दों में, हम कह सकते हैं कि हम तुलना सत्यापन नियंत्रण का उपयोग करते हैं जब हमें फ़ील्ड के अंदर इनपुट किए जाने वाले डेटा को किसी अन्य फ़ील्ड में इनपुट करने के लिए डेटा के साथ मिलान करना होता है कि मान बराबर या उससे कम है तो बराबर है। बराबर है या नहीं।
उदाहरण के लिए, जैसा कि आपने देखा होगा कि ऑनलाइन पंजीकरण फॉर्म में पासवर्ड को दो बार दर्ज करना होता है, ताकि आप जांच सकें कि आपने पासवर्ड सही ढंग से दर्ज किया है, ऐसा करने के लिए दोनों पासवर्ड फ़ील्ड बराबर के लिए चेक किए गए हैं।
इसकी property निम्नलिखित है
| SN | Property | Description |
|---|---|---|
| 1 | ControlToValidate | Specifies the ID of the control that you want to validation. |
| 2 | Text | Sets the error message display by the control. |
| 3 | Display | Sets how the error message content in the text property is displayed, possible values are static dynamic and none the default value is static. |
| 4 | Enable Client Script | Enable and visible client side from validation. This property has the value true by default. |
| 5 | Error Message | Specify the error message that is displayed in the validation summary control this error message is displayed by the validation control when the text property is not set. |
| 6 | Isvalid | Has the value true when the validation check succeeded and false other. |
| 7 | Type | Gets and sets the data type to use when comparing values, possible values are currency, date double integer and string. |
| 8 | Control to Compare | Specifies the ID of the control to use for comparing values. |
| 9 | Operator | Gets and sets the comparison operator to use performing comparison possible values are equal not equal greater than greater than, less than equal data type. |
| 10 | Value To Compare | Specifies the value use when performing the comparison. |
3. Range Validator
रेंज वैलिडेटर कंट्रोल की मदद से यह चेक किया जाता है कि फॉर्म फील्ड का मान किसी न्यूनतम और अधिकतम संख्या के बीच है या नहीं। यह मान दिनांक, संख्या क्रुनेंसी, राशि या स्ट्रिंग हो सकता है।
यानी, रेंज वैलिडेशन कंट्रोल का उपयोग तब किया जाता है जब हमें एप्लिकेशन में इनपुट होने वाले मूल्य की जांच करनी होती है कि मूल्य न्यूनतम मूल्य से कम नहीं है और अधिकतम मूल्य से अधिक नहीं है। इसके लिए हम इस सत्यापन का उपयोग करते हैं। इसकी संपत्ति निम्नलिखित है।
| SN | Property | Description |
|---|---|---|
| 1 | ControlToValidate | Specifies the ID of the control that you want to validation. |
| 2 | Text | Sets the error message display by the control. |
| 3 | Display | Sets how the error message content in the text property is displayed, possible values are static dynamic and none the default value is static. |
| 4 | Enable Client Script | Enable and visible client side from validation. This property has the value true by default. |
| 5 | Error Message | Specify the error message that is displayed in the validation summary control this error message is displayed by the validation control when the text property is not set. |
| 6 | Isvalid | Has the value true when the validation check succeeded and false other. |
| 7 | Minimum Value | Specifies the minimum value in the range of values. |
| 8 | Maximum Value | Specifies the maximum value in the range of permissible values. |
| 9 | Type | Gets and sets the data type to use when comparing values. Possible values are currency, date double, integer & string. |
| 10 | Validate | Perform Validation and update the isvalid property. |
4. Regular Expression Validator
रेगुलर एक्सप्रेशन वैलिडेटर की मदद से रेगुलर एक्सप्रेशन के क्षेत्र में दर्ज किए जाने वाले मान का मिलान किया जाता है। इसकी मदद से हम यूजर द्वारा दर्ज की गई वैल्यू को चेक करते हैं। उदाहरण के लिए, उपयोगकर्ता द्वारा दर्ज किया गया ईमेल पता सही है या नहीं, या टेलीफोन नंबर या पासवर्ड, आदि।
दूसरे शब्दों में, हम कह सकते हैं कि जब उपयोगकर्ता नियमित अभिव्यक्ति सत्यापन का उपयोग करता है, तो उपयोगकर्ता द्वारा फ़ील्ड इनपुट में ईमेल आदि को आसानी से चेक किया जा सकता है।
उदाहरण के लिए अगर हम रेगुलर एक्सप्रेशन की मदद से ईमेल चेक करना चाहते हैं तो हम निम्नलिखित एक्सप्रेशन का उपयोग करेंगे:
"^[a-zA-Z0-9+_.-]+@[a-zA-Z0-9.-]+$"
Regular expression validator की मुख्य properties निम्नलिखित है
| SN | Property | Description |
|---|---|---|
| 1 | ControlToValidate | Specifies the ID of the control that you want to validation. |
| 2 | Text | Sets the error message display by the control. |
| 3 | Display | Sets how the error message content in the text property is displayed, possible values are static dynamic and none the default value is static. |
| 4 | Enable Client Script | Enable and visible client side from validation. This property has the value true by default. |
| 5 | Error Message | Specify the error message that is displayed in the validation summary control this error message is displayed by the validation control when the text property is not set. |
| 6 | Isvalid | Has the value true when the validation check succeeded and false other. |
| 7 | Validate | Perform validation and update the Invalid property. |
| 8 | Validation Expression | Specifies the regular expression to use when performing validation. |
5. Custom Validator
कस्टम सत्यापन एक ऐसा सत्यापनकर्ता है जिसे उपयोगकर्ता अपनी आवश्यकता के अनुसार बनाता है। इसका मतलब है कि सत्यापन में कोई पूर्वनिर्धारित विशेषता नहीं है। उपयोगकर्ता अपनी आवश्यकता के अनुसार इस सत्यापन का उपयोग करके डेटा को मान्य कर सकता है। इसका मतलब है कि आप अपने अनुसार किसी भी रीटाइप का वेलिडेशन कंट्रोल बना सकते हैं। कस्टम सत्यापन में मुख्य 3 गुण होते हैं जो इस प्रकार हैं
| SN | Property | Description |
|---|---|---|
| 1 | ControlToValidate | Specifies the ID of the control that you want to validation. |
| 2 | Text | Sets the error message didplay by the control. |
| 3 | ClientValidationfunction | The name of the client-side function use to perform client side validation. |
CustomValidator एक event support करता है
- Server Validate – This event is raised when the custom validation perform validation.
6. Validation Summary
सत्यापन सारांश नियंत्रण का उपयोग करके, हम पृष्ठ में उपयोग की गई सभी सत्यापन त्रुटियों की एक सूची प्रदर्शित कर सकते हैं। ये नियंत्रण बड़े रूपों के साथ काम करने के लिए उपयोगी होते हैं। यदि कोई उपयोगकर्ता पृष्ठ के अंत में उपलब्ध फ़ील्ड में गलत मान दर्ज करता है, तो उपयोगकर्ता को त्रुटि संदेश कभी भी दिखाई नहीं देता है। यदि सत्यापन सारांश नियंत्रण हमारे द्वारा उपयोग किया जाता है तो हम प्रपत्र के शीर्ष पर त्रुटियों की सूची प्रदर्शित कर सकते हैं। यहां ध्यान देने योग्य बात यह है कि प्रत्येक सत्यापन नियंत्रण में एक त्रुटि संदेश गुण शामिल होता है। हम सत्यापन त्रुटि संदेश दिखाने के लिए त्रुटि संदेश गुण के बजाय पाठ गुण का उपयोग करते हैं।
त्रुटि संदेश और पाठ गुण के बीच का अंतर यह है कि त्रुटि संदेश गुण में संदेश सत्यापन सारांश नियंत्रण में प्रकट होता है। जबकि टेक्स्ट प्रॉपर्टी में किया गया मैसेज पेज की बॉडी पर दिखाई देता है। आम तौर पर हम टेक्स्ट प्रॉपर्टी के साथ एरर मैसेज दिखाते हैं। इसके गुण इस प्रकार हैं-
| SN | Property | Description |
|---|---|---|
| 1 | Display Mode | enables you to specify how the error message are formatted. Possible values are – bullet list, list and symbol paragraph. |
| 2 | Header text | enables you to display header, header text above the validation summary. |
| 3 | Show Message Box | Enables you to display a pop-up alert box. |
Final Words
तो दोस्तों आपको हमारी पोस्ट कैसी लगी! शेयरिंग बटन पोस्ट के नीचे इसे अपने दोस्तों के साथ शेयर करना न भूलें। इसके अलावा अगर बीच में कोई परेशानी हो तो कमेंट बॉक्स में पूछने में संकोच न करें। आपकी सहायता कर हमें खुशी होगी। हम इससे जुड़े और भी पोस्ट लिखते रहेंगे। तो अपने मोबाइल या कंप्यूटर पर हमारे ब्लॉग “various info: Education and Tech” को बुकमार्क (Ctrl + D) करना न भूलें और अपने ईमेल में सभी पोस्ट प्राप्त करने के लिए हमें अभी सब्सक्राइब करें।
अगर आपको यह पोस्ट अच्छी लगी हो तो इसे अपने दोस्तों के साथ शेयर करना ना भूलें। आप इसे व्हाट्सएप, फेसबुक या ट्विटर जैसी सोशल नेटवर्किंग साइटों पर साझा करके अधिक लोगों तक पहुंचने में हमारी सहायता कर सकते हैं। शुक्रिया!