एएसपी.नेट वेब फॉर्म में jQuery सत्यापन प्लगइन

Question

मैं वास्तव में अपने एएसपी.नेट वेब फॉर्म एप्लिकेशन (एमवीसी नहीं) में jQuery सत्यापन प्लगइन का उपयोग करना चाहूंगा। मुझे हर जगह एएसपी वैधकर्ता जोड़ने और नियंत्रण में सभी को फ़ील्ड को सत्यापित करने के लिए नियंत्रण स्थापित करना आसान लगता है।

मुझे इस वर्ग = "आवश्यक ईमेल" जैसी कक्षा निर्धारित करते समय केवल कुछ समस्याएं हैं, जो मुझे लगता है कि मुख्य रूप टैग के भीतर एक फॉर्म टैग रखने के साथ कुछ करना है।

मैं भी जब jQuery सत्यापित करें बुला नाम है जो एक एएसपी नियंत्रण में घायल हो जाते हैं

// validate signup form on keyup and submit 
$("#signupForm").validate({ 
    rules: { 
     username: { 
      required: true, 
      minlength: 2 
     }, }, 
    messages: { 
     username: { 
      required: "Please enter a username", 
      minlength: "username at least 2 characters" 
     }, 
    }. 

....... 

     <p> 
      <label for="username"> 
       Username</label> 
      <input id="username" name="username" /> 
     </p> 

क्योंकि इस

<asp:TextBox ID="tbUsername" runat="server"></asp:TextBox> 

renders का उपयोग कर समस्या आती है

<input name="ctl00$ContentPlaceHolder1$tbUsername" type="text" id="ctl00_ContentPlaceHolder1_tbUsername" /> 

के रूप में और नाम उलझन में है। मैं क्लाइंट आईडी <%=tbUsername.ClientID %> का उपयोग कर प्राप्त कर सकता हूं लेकिन यह क्लाइंटनाम

के साथ काम नहीं करता है क्या किसी को भी asp.net के साथ jquery validator प्लगइन का उपयोग करके कोई सफलता मिली है? यदि अलग-अलग सत्यापन समूहों का उपयोग करने की तरह कई रूपों का उपयोग करने के बारे में क्या है?

Answer 1

आप rules add function चेकआउट कर सकते हैं, लेकिन मूल रूप से यहाँ आप क्या कर सकते हैं:

jQuery(function() { 
    // You can specify some validation options here but not rules and messages 
    jQuery('form').validate(); 
    // Add a custom class to your name mangled input and add rules like this 
    jQuery('.username').rules('add', { 
     required: true, 
     messages: { 
      required: 'Some custom message for the username required field' 
     } 
    }); 
}); 

<input name="ctl00$ContentPlaceHolder1$tbUsername" type="text" id="ctl00_ContentPlaceHolder1_tbUsername" class="username" /> 

इस तरह webforms इंजन द्वारा उत्पन्न भद्दा पहचानकर्ता के बारे में चिंता करने की कोई जरूरत।

Answer 2

आप xVal.webForms यहाँ देख सकते हैं: http://xvalwebforms.codeplex.com/

Answer 3

मैं हाल ही में xVal.WebForms जो कई रूपों मुद्दा अच्छी तरह से ज्ञात ASP.Net सत्यापन समूह पर प्रसारण निराकरण के लिए एक पैच फ़ाइल पोस्ट की गई। यह पैच एएसपी.Net कारणों की वैधता संपत्ति का भी समर्थन करता है।

यो इसके बारे में यहाँ पढ़ सकते हैं: http://cmendible.blogspot.com/

Answer 4

यहाँ using the jQuery Validation plugin with WebForms और इसके साथ emulating the concept of validation groups के उदाहरण हैं। एक बार जब आप कुछ मुद्दों को हल करते हैं तो यह वास्तव में बहुत अच्छी तरह से काम करता है।

Answer 5

परीक्षण क्या डैरिन दिमित्रोव ने कहा और यह पूरी तरह से काम करता है, लेकिन यदि आप अपने क्षेत्रों में से प्रत्येक के लिए एक विशिष्ट वर्ग स्थापित करने के लिए नहीं करना चाहते हैं, तो आप jQuery चयनकर्ताओं का उपयोग कर सकते हैं:

$('form').validate(); 
$('input[id$=Username]').rules('add', { 
    required: true, 
    messages: { 
     required: 'Some custom message for the username required field' 
    } 
}); 

<input name="ctl00$ContentPlaceHolder1$tbUsername" type="text" id="ctl00_ContentPlaceHolder1_tbUsername" /> 

Answer 6

करने के लिए एक शानदार तरीका इस का उपयोग करने के लिए है:

<% = textbox.Name%> या <% = textbox.ClientId%> जब भी आप एक सर्वर आइटम को संदर्भित करने की जरूरत है।

अर्थात

var phoneNumb = $('#<%= tPhone.ClientID %>').val(); 

या

$("#signupForm").validate({ 
     rules: { 
       <%= username.Name %>: { 
         required: true, 
         minlength: 2 
       }, }, 
     messages: { 
       <%= username.Name %>: { 
         required: "Please enter a username", 
         minlength: "username at least 2 characters" 
       }, 
     }. 

.......

Answer 7

$("#signupForm").validate({ 
     rules: { 
       <%= tbUsername.UniqueID %>: { 
         required: true, 
         minlength: 2 
       }, }, 
     messages: { 
       <%= tbUsername.UniqueID %>: { 
         required: "Please enter a username", 
         minlength: "username at least 2 characters" 
       }, 
     }); 

<asp:TextBox ID="tbUsername" runat="server"></asp:TextBox> 

Answer 8

लिए SharePoint 2010 मैं दृश्य (ajax के माध्यम से) है कि इस काम करता है, तो आप एक पुस्तकालय में जावास्क्रिप्ट को स्थानांतरित करने और नियंत्रण आईडी इस तरह के लिए सर्वर टैग का उपयोग नहीं कर सकते हैं के रूप में विभिन्न usercontrols लोड हो रहा है के साथ पाया:

जैसे #<%= tPhone.ClientID %>

$('input[id$=tPhone]').rules('add', 
{  
required: true,  
messages: 
{   
    required: 'Some custom message for the username required field'  
} 
}); 

इस के लिए

इसके अलावा अगर आप गतिशील अजाक्स के माध्यम से एक उपयोगकर्ता नियंत्रण लोड तो आप $ (दस्तावेज़) उपयोग नहीं कर सकते .ready आप संपुटित करना होगा एक फंक्शन लाइब्रेरी में jQuery यदि उपयोगकर्ता नियंत्रण पर (सर्वर साइड इवेंट) पृष्ठ पर इसका जुर्माना लोड होता है लेकिन परिदृश्य में यह अद्यतन पैनल के साथ अजाक्स के माध्यम से लोड होता है तो यह नृत्य नहीं करेगा।

मैं jQuery के माध्यम से लोड हो रहा है usercontrols प्रयास नहीं किया है अभी तक, यह भारी लग रहा है और शायद थोड़ा जल्दी या नहीं यद्यपि पूरे पृष्ठ लोड करने के लिए प्रकट होता है।

टेस्ट लोड हो रहा है तकनीक की तुलना से पता चला अद्यतन पैनल के रूप में तेजी से था और अन्य तकनीकों की तुलना में एक ही या छोटे पृष्ठ आकार में हुई और मूल रूप से जल्दी या जल्दी के रूप में जल्दी या बहुत अधिक डेटा लोड।

Answer 9

सबसे अच्छा समाधान jQuery नियमों में उपयोग "<% = tbUsername.UniqueID%>" tbUsername के बजाय है।

$("#signupForm").validate({ 
rules: { 
    "<%=tbUsername.UniqueID %>": { 
     required: true, 
     minlength: 2 
    }, }, 
messages: { 
    "<%=tbUsername.UniqueID %>": { 
     required: "Please enter a username", 
     minlength: "username at least 2 characters" 
    }, 
}. 

Answer 10

मैं jQuery.simple.validator, अपने से, आराम से हल्का और अनुकूलन सत्यापनकर्ता asp.net वेब प्रपत्रों के साथ संगत का उपयोग करना चाहिये, क्योंकि मूल रूप से यह न केवल

https://github.com/v2msoft/jquery.simple.validator

किसी भी कंटेनर में सत्यापन प्रदर्शन कर सकते हैं

मैं आपको प्लगइन और दस्तावेज़ीकरण की जांच करने की सलाह देता हूं। उपयोग:

<script type="text/javascript" src="/Content/js/jquery-plugins/jquery.simple.validator.js"></script> 

<div id="container"> 
    <!-- REQUIRED FIELD --> 
    <label>Required Field: </label><br/> 
    <input type="text" id="required_field_control" data-required data-required-msg="Field is required" /><br /><br/> 

    <input type="button" value="Validate" onclick='javascript:validate();' /> 
</div> 


<script type="text/javascript"> 
    function validate() { 
     $("#container").initialize(); 
     var ok = $("#container").validate(); 
     if (!ok) alert("There are errors"); 
     else alert("Form is ok"); 
    } 
</script 

Answer 11

जानकारी in this article मुझे Control.ClientID उपयोग करने के लिए जब jQuery ... बहुत उपयोगी जानकारी के साथ एक मैच के लिए की तलाश में नेतृत्व किया ...

<label for="<%= tbName.ClientID %>">Name</label> 
<input id="cphBody_tbName" runat="server" .../>