2017-10-03 16 views
12

मैं एक वेबफ़ॉर्म अनुप्रयोग हैउत्प्रेरक asp.Net LinkButton OnClientClick पर html5 फ़ॉर्म सत्यापन

मास्टर पृष्ठ में मैं फार्म का

<body class="tile-1-bg"> 
<form id="form1" runat="server"> 

और मेरे page.aspx

<div class="control-group" runat="server" id="divNome"> 
    <label for="txtNome" class="control-label">Nome o Ragione Sociale*</label> 
    <div class="controls"> 
     <asp:TextBox runat="server" ID="txtNome" class="form-control input-sm" required></asp:TextBox> 
    </div> 
</div> 
<asp:Linkbutton runat="server" ID="lnkBtnRegistrati" class="btn btn-default btn-lg btn-block" Text="REGISTRATI" OnClientClick="if(checkForm())return true; else return false;" OnClick="lnkBtnRegistrati_Click"></asp:Linkbutton> 

मैं में एक जावास्क्रिप्ट फ़ंक्शन को कॉल करना चाहते हैं जो बटन सबमिट करता है और झूठी वापसी करता है अगर कुछ सत्यापन गलत हो जाता है और फॉर्म फ़ील्ड पर त्रुटियों को दिखाता है।

function checkForm() 
    { 
     ? 
    } 

मैं कैसे कर सकता हूं?

+0

मैं अपने सिर में एक विचार है, लेकिन अगर तुम मुझे के और अधिक क्या linkbutton के कोड के पीछे क्या करेंगे दिखा सकते हैं, मैं आपको बेहतर करने में मदद करने में सक्षम हो जाएगा:

उदाहरण उपयोग इस प्रकार हो सकता है – JKOU

उत्तर

1

तुम क्या चाहते, checkform का परिणाम वापस जाने के लिए है कि आप इसे checkform विधि में राज्य है संभाल कर सकते हैं यह आत्म:

Aspx कोड

परिवर्तन

<asp:Linkbutton runat="server" ID="lnkBtnRegistrati" class="btn btn-default btn-lg btn-block" Text="REGISTRATI" OnClientClick="if(checkForm())return true; else return false;" OnClick="lnkBtnRegistrati_Click"></asp:Linkbutton> 

से

को
<asp:Linkbutton runat="server" ID="lnkBtnRegistrati" class="btn btn-default 
btn-lg btn-block" Text="REGISTRATION" OnClientClick="return checkform();" 
OnClick="lnkBtnRegistrati_Click"></asp:Linkbutton> 

अपने जावास्क्रिप्ट में विधि:

function checkForm() 
    { 
     if(true) // your condition to check 
     { 
      return true; 

     } 
     else{ 
       return false; 
      } 
    } 

स्पष्टीकरण:

मार्कअप Onclientclick में वापस आ जाएगी कि क्या आपके हालत या नहीं मिले, यदि आपका स्थिति से संतुष्ट हैं, तो आप return true उपाध्यक्ष के रूप में वापस किया जाएगा बनाम इसलिए इस तरह आप प्राप्त कर सकते हैं

3

आप अपना खुद का सत्यापन बना सकते हैं और मूल्य वापस कर सकते हैं। आप OnClientClick="return checkForm()"

<div id="errorSummary" style="display: none;">For is invalid!</div> 

<script type="text/javascript"> 
    function checkForm() { 
     var formIsValid = false; 

     //do your form validation 
     if ($("#<%= txtNome.ClientID %>").val() != "") { 
      formIsValid = true; 
     } 

     //show or hide the error message 
     if (!formIsValid) { 
      $("#errorSummary").show(); 
     } else { 
      $("#errorSummary").show(); 
     } 

     //return the validation result 
     return formIsValid; 
    } 
</script> 

को OnclientClick बदलने की जरूरत है लेकिन क्या आप भी Validaton नियंत्रण में निर्माण और एक ValidationSummary साथ भी ऐसा ही कर सकते हैं

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

<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" 
    ErrorMessage="Input cannot be empty" ControlToValidate="txtNome" Display="Dynamic"> 
</asp:RequiredFieldValidator> 

<asp:ValidationSummary ID="ValidationSummary1" runat="server" /> 

<asp:LinkButton runat="server" ID="lnkBtnRegistrati" Text="REGISTRATI"></asp:LinkButton> 

ध्यान दें कि इनपुट फ़ील्ड पर required विशेषता केवल द्वारा समर्थित है सबसे हालिया ब्राउज़र, https://www.w3schools.com/TAgs/att_input_required.asp

1

आप फ़ॉर्म पर सबमिट() को कॉल कर सकते हैं, जो ब्राउज़र सत्यापन को ट्रिगर करेगा। इसमें कोई वापसी मूल्य नहीं है लेकिन स्वचालित रूप से फ़ॉर्म सबमिट करता है। आपका कोड यह नहीं दिखाता है कि इसके बाद आपको कुछ और करने की ज़रूरत है, इसलिए OnClientClick ईवेंट में सत्य या गलत लौटना आवश्यक नहीं है।

document.getElementById("form1").submit(); 

लेकिन जब तक आप एक हिस्सा बाहर छोड़ दिया यह सिर्फ एक

<input type="submit" runat="server" /> 
1

मैं सुझाव है कि आप jQuery.validationEngine का उपयोग करने के साथ लिंक बटन को बदलने के लिए और भी आसान हो जाएगा।

<html> 
<head> 
<script src="../ValidationFiles/jquery.validationEngine-en.js"></script> 
<script src="../ValidationFiles/jquery.validationEngine.js"></script> 
<link href="../ValidationFiles/validationEngine.jquery.css rel="stylesheet"/> 
<script type="text/javascript"> 
    jQuery(document).ready(function() { 
jQuery("#form1").validationEngine(); 
    }); 
</script> 
</head> 
<body> 
<form id="#form1"> 
<asp:TextBox ID="txtEmployeeAddress" runat="server" CssClass="form-control validate[required]"></asp:TextBox> 
<asp:Button ID="btnFooterAddPopupSave" runat="server" class="btn btn-primary" Text="Add Category" OnClientClick="return jQuery('#form1').validationEngine();" OnClick="btnFooterAddPopupSave_Click" /> 
</form> 
</body> 
</html> 

नोट: आवश्यक के लिए एलिमेंट की कक्षा में "मान्य [आवश्यक]" जोड़ें। Example is Here

1

आप किसी भी जावास्क्रिप्ट प्लगइन्स और ब्राउज़र (रों) है कि आप समर्थन यह लक्षित कर रहे हैं का उपयोग नहीं करना चाहते, तो आप एचटीएमएल 5 form.checkValidity() और form.reportValidity() तरीकों का उपयोग कर सकते हैं। आप HTML5 form support पर व्यक्तिगत ब्राउज़रों के खिलाफ इस कार्यक्षमता के लिए समर्थन की जांच कर सकते हैं - फॉर्म सत्यापन अनुभाग देखें।

function checkForm() { 
    var form = $("#<%= form1.ClientID %>")[0]; 
    if (!form.checkValidity()) { 
    if (form.reportValidity) { 
     //Show errors on form fields 
     form.reportValidity(); 
    } 
    else { 
     //Fall-back for browsers that don't support reportValidity() 
    } 
    return false; 
    } 
    return true; 
} 
संबंधित मुद्दे