How can i Use Javascript validation in asp.net

Question

0.00/5 (No votes)

See more:

, +

Dear Experts,

I ma Doing an Asp.net project. And i am using javascript form Validations.

I have a doubt in my project, can i use Javascript validation in asp.net.

Means, When i click a button, i need to validate forms, after the successful validation then the button click event will be fired.

How can i do this....?? Is there any way to do like this..???

Here is the Below Javascript code...

JavaScript

$(document).ready(function() {
							   
		if($.fn.select2) {
			
			$( '.select2-select' ).select2();
			
		}
		
		if( $.fn.validate ) {
			
			
			$("#validate1").validate({
				rules: {
					req1: {
						required: true
					}, 
					email1: {
						required: true, 
						email: true
					}, 
					url1: {
						required: true, 
						url: true
					}, 
					pass1: {
						required: true, 
						minlength: 5
					}, 
					cpass1: {
						required: true, 
						minlength: 5, 
						equalTo: '[name="pass1"]'
					}, 
					digits1: {
						required: true, 
						digits: true
					}
				}, 
				invalidHandler: function(form, validator) {
					var errors = validator.numberOfInvalids();
					if (errors) {
						var message = errors == 1
						? 'You missed 1 field. It has been highlighted'
						: 'You missed ' + errors + ' fields. They have been highlighted';
						$("#da-ex-val1-error").html(message).show();
					} else {
						$("#da-ex-val1-error").hide();
					}
				}
			});

});

Here is the HTML COde

ASP.NET

<form id="validate1" class="form-horizontal" runat="server">
 <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>										    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
												<ContentTemplate>

<div class="control-group">
   <label class="control-label" for="input01">Account Code</label>
      <div class="controls">
													<asp:TextBox ID="txt_Acc_Code" runat="server" class="input-small" placeholder="Account Code" name="req1"></asp:TextBox>
                                                   
      </div>
   </div>
                                                
<div class="form-actions">
  <asp:Button ID="btnSave" runat="server" Text="Save changes" class="btn btn-primary" OnClick="btnSave_Click"/>
  <asp:Button ID="btnCancel" runat="server" Text="Cancel" class="btn"/>                                                   
</div>
											</ContentTemplate>            
</asp:UpdatePanel>
</form>

Here is the C# code

C#

protected void btnSave_Click(object sender, EventArgs e)
       {

       }

PLease Help me....

Thanks and Regards,
Dileep

Posted 22-May-13 6:13am

dilzz

Updated 22-May-13 6:21am

v3

Add a Solution

Comments

ZurdoDev 22-May-13 13:27pm

It looks like you are already using something to validate, $.fn.validate. Is it not working?

dilzz 22-May-13 13:28pm

no.. no it's not working... now only fired the click event only...

[no name] 23-May-13 2:32am

what he wrote was not javascript it seems like jquey

3 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Tadit Dash (ତଡିତ୍ କୁମାର ଦାଶ) · Answer 1 · 2013-05-22T08:37:00

If you want to do validation on button click, then try to do as follows.

JavaScript

$(document).ready(function(){
    $('#btnSave').click(function(){
         var valid = false;

         // Check validations.
         // Assign bool value to 'valid' variable according to validation status.
         if(valid == true)
         {
             return true;
             // As the return is true, so after this line, the button click in server side will be fired.
         }
         else
         {
             return false;
         }
    });
});

Try to put this logic. Let me know if there are any problems.

KK Kod · Answer 2 · 2013-05-22T19:47:00

Yes Of course,you can very much use JavaScript validation in your project.
1)Get all your form elements using JQuery
Say you have got a set of Text boxes,check boxes ,Dropdown lists and radio buttons too
2)Create validation status variable for each type of controls
Say var validateTextBox
var validateCheckBox,varValidateRadio like wise assign these as true at initial.

Please see below code snippet to get list of controls in the form

JavaScript

//Which gets all radio buttons  which are children of a div with Id called #dialog-pricing as array rdoBtns 
 var rdoBtns = $('#dialog-pricing').find("input[name^='ucControl']:radio:visible:enabled").map(function () { return $(this).attr("name"); }).get();

JavaScript

//Which gets all drop down list which are children of a div with Id called #dialog-pricing
as array dropdownIDsArray 
var dropdownIDsArray = new Array();
    dropdownIDsArray = $.map($("div[id*=dialog-pricing]").find("select:visible:enabled"), function (item, index) {
        return $(item).attr("id");
    });

as mentioned above get all the controls lop through the array which contains name or id of the control
validate the controls as you require
if you found any of your controls breaks the validation condition break from there,
set the particular validation status as false(validateCheckBox,varValidateRadio).
get the id of the unsatisfied control highlight the control or its containing div or a alert message.

only if all the validation status variables are true then only do the post back or further operation required.
any confusions please let me know ...

MaulikDusara · Answer 3 · 2013-05-22T20:11:00

Solution 3

Hi,

You need to refer below links, May be helpful to you.

http://docs.jquery.com/Plugins/Validation[^]

An Example of Using the jQuery Validation Plug-in[^]

Posted 22-May-13 20:11pm

MaulikDusara

How can i Use Javascript validation in asp.net

3 solutions

Solution 1

Solution 2

Solution 3

Add your solution here

Preview 0