ASP.NET MVC और Backbone.js के साथ विनीत मान्यता

वेब एप्लिकेशन विकसित करते समय, हम Asp.net MVC और backbone.js का उपयोग करते हैं। सत्यापन तर्क लिखते समय, हमें कोड दोहराव की समस्या थी। तर्क को सर्वर पर मॉडल में और क्लाइंट पर बैकबोन मॉडल में वर्णित किया जाना है। मैं सर्वर से क्लाइंट के लिए सत्यापन नियमों को स्वचालित रूप से स्थानांतरित करना चाहूंगा। इस समस्या को हल करने के लिए, हमने backbone.js विवरण के लिए मानक विनीत MVC डेटा सत्यापन का एक एनालॉग लागू किया।

परिचय

हाल ही में, वेब अनुप्रयोगों में उपयोगकर्ता आमतौर पर एक चेक से तत्काल प्रतिक्रिया की उम्मीद कर रहे हैं - सर्वर पर कुछ भी भेजे बिना। इसे क्लाइंट-साइड सत्यापन कहा जाता है। MVC फ्रेमवर्क विनीत क्लाइंट-साइड सत्यापन का समर्थन करता है। शब्द "विनीत" का अर्थ है कि सत्यापन नियम उन विशेषताओं का उपयोग करके व्यक्त किए जाते हैं जो उत्पन्न HTML तत्वों में जोड़े जाते हैं। उनकी व्याख्या जावास्क्रिप्ट लाइब्रेरी (jquery.validatate.unbtrusive.js), MVC फ्रेमवर्क के हिस्से से की जाती है, जो jQuery मान्यता लाइब्रेरी कॉन्फ़िगरेशन के लिए विशेषता मान लागू करता है, जो सभी सत्यापन कार्य करता है।

मैं डेटा सत्यापन के लिए एक समान दृष्टिकोण का उपयोग करना चाहूंगा यदि बैकबोन.जेएस क्लाइंट पक्ष पर उपयोग किया जाता है। यह लेख इस दृष्टिकोण के कार्यान्वयन पर चर्चा करता है।

MVC में निर्मित क्लाइंट-साइड सत्यापन के बारे में अधिक विवरण यहां पाया जा सकता है:

• ASP.NET MVC 3 में विनीत जावास्क्रिप्ट
• क्लाइंट साइड डेटा सत्यापन
• ASP.NET MVC 3 पेशेवरों के लिए C # उदाहरण के साथ फ्रेमवर्क

कार्यान्वयन

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

बैकबोन केवल एक बिंदु प्रदान करता है जिस पर हम अपने सत्यापन तर्क का वर्णन कर सकते हैं। हमारे सत्यापन तर्क का वर्णन करने के लिए, हम Backbone.Validation का उपयोग करते हैं। यह लाइब्रेरी आपको सरल सत्यापन नियम निर्धारित करने की अनुमति देती है।

var SomeModel = Backbone.Model.extend({ validation: { name: { required: true, msg: 'Please enter Name } } }); 

आप यहाँ Backbone.Validation लाइब्रेरी के बारे में अधिक पढ़ सकते हैं:

• Backbone.Validation

हमारे दृष्टिकोण के पीछे का विचार विशेषताओं से नियमों को पढ़ना और बैकबोन के लिए सत्यापन नियम बनाना है। अमान्यकरण।

हमारे कोड में Backbone.validation एम्बेड करने की बात Backbone.Validation.bind (दृश्य) पद्धति को देखने के अंदर करने के लिए एक कॉल है:

 var SomeView = Backbone.View.extend({ initialize: function(){ Backbone.Validation.bind(this); } }); 

इसलिए, हम इसमें विशेषताओं को नियमों में परिवर्तित करने के लिए कोड को अपने स्वयं के आवरण के साथ बदल देंगे।

  Backbone.Validation.bind = _.wrap(Backbone.Validation.bind, function (bind, view, options) { if (options.autoValidation) { var validation = {}; //      view.$("[data-val=true]").each(function (item, selector) { var data = $(this).data(); var options = Backbone.Validation.adapters._create(data); if (options) validation[data.valAttr || this.name] = options; }); if (view.model && !_.isEmpty(validation)) view.model.validation = validation; } return bind(view, options); }); 

हमारे आवरण में हमने Backbone.Validation.adapters का उपयोग किया था। इस ऑब्जेक्ट में प्रत्येक विशेषता के लिए एडेप्टर की एक सूची और एक केंद्रीय _create पद्धति शामिल है जो तत्व की सभी विशेषताओं के लिए एडेप्टर कहती है। इसका संक्षिप्त कोड नीचे दिया गया है।

  Backbone.Validation.adapters = { valRequired: function (data) { return { required: true, msg: data.valRequired }; }, valLength: function (data) { return { rangeLength: [data.valLengthMin, data.valLengthMax], msg: data.valLength }; }, //       _create: function (data) { var options = []; for (var p in data) if (this[p]) options.push(this[p](data)); return options.length ? options : undefined; }, }; 

अब अगर हम चाहते हैं कि सत्यापन नियम पढ़ें, तो हमें स्वतः सत्यापन जोड़ने की आवश्यकता है: बाइंड मेथड कॉल के लिए सही पैरामीटर नीचे दिखाए गए हैं:

 Backbone.Validation.bind(this, {autoValidation: true}); 

सारांश

यह आलेख डेटा सत्यापन के लिए एक दृष्टिकोण का वर्णन करता है यदि Backbone.js क्लाइंट पक्ष पर उपयोग किया जाता है। हमने क्लाइंट और सर्वर साइड पर तर्क और कोड के दोहराव से बचा। क्लाइंट डेटा सत्यापन के लिए मानक MVC दृष्टिकोण का उपयोग किया गया था।