Web and Mobile Apps Codeware: validation

Showing posts with label validation. Show all posts

Friday, December 5, 2014

Angularjs : HTML form validation example

hi let see how to do validate a html form using angularjs

example :

<!DOCTYPE html>
<html>

<head>
<script src=”https://code.angularjs.org/1.2.9/angular.js”></script>
<script>
function EmpForm($scope) {
$scope.empname = ‘Chandan Singh';
$scope.empemail = ‘chandan.may2@gmail.com';
}
</script>

</head>

<body>

<form ng-app=”” ng-controller=”EmpForm” name=”EmpFormPage” novalidate>

Emp name:
<input type=”text” name=”empname” ng-model=”empname” required>
<span ng-show=”EmpFormPage.empname.$error.required”>Please Enter Emp Name</span>

<br>
<br>

Email:
<input type=”email” name=”empemail” ng-model=”empemail” required>
<span ng-show=”EmpFormPage.empemail.$error.required”>Please Enter Email Address</span>
<span ng-show=”EmpFormPage.empemail.$error.email”>Invalid Email Address</span>

<p>
<input type=”submit” ng-disabled=”EmpFormPage.empname.$invalid || EmpFormPage.empemail.$invalid”>
</p>

</form>

</body>
</html>

ng-show directive show and hides the error messages as per the expression provided into it.
ng-disabled directive will disable the submit button till all the fields are validated properly

Output:

Sunday, April 13, 2014

Sample Code to validate from date and to date in JavaScript/jquery || checkin date and checkout date validation using JavaScript(js)

Javascript :

Below is the code to validate fromdate and todate using javascript.

function validateDate() {

var fromdate, todate, date1, date2;
var chkFrom = document.getElementById('date');
var chkTo = document.getElementById('date2');

fromdate = chkFrom.value;
todate = chkTo.value;

date1 = new Date(fromdate);
date2 = new Date(todate);

if (date2 <= date1) {
alert("To date Should be greater than From date");

return false;
}
return true
}
</script>

Web Page:

calling the above javascript function on button click

<div>
<button type="button" id="btnsubmit" class="btn" onclick="return validateDate();"> Submit</button>
</div>

Thursday, October 24, 2013

javascript to allow textbox decimal value upto 2 places only

Below is the function which will validate the text box value and will only allow to enter decimal upto 2 places:

Method 1:

Javascript Function:

function checkDecimal(el){
var ex = /^[0-9]+\.?[0-2]*$/;
if(ex.test(el.value)==false){
alert('Decimal Value upto 2 places allowed !');
el.value = '';
}
}

In textbox properties add onblur and call above javascript function:

<asp:TextBox runat="server" Width="180px" ID="textbox1" onblur="checkDecimal(this);" />

Method 2:

Javascript Function:

function onlyDotsAndNumbers(txt, event) {
var charCode = (event.which) ? event.which : event.keyCode
if (charCode == 46) {
if (txt.value.indexOf(".") < 0)
return true;
else
return false;
}

if (txt.value.indexOf(".") > 0) {
var txtlen = txt.value.length;
var dotpos = txt.value.indexOf(".");
if ((txtlen - dotpos) > 2)
return false;
}

if (charCode > 31 && (charCode < 48 || charCode > 57))
return false;

return true;
}

aspx page:

<asp:TextBox runat="server" Width="180px" ID="textbox1" onkeypress="return onlyDotsAndNumbers(this,event);" />

Tuesday, September 17, 2013

check whether checkbox is checked or not in Jquery Asp.net | validate checkbox using Jquery

hi in this post i will show how to validate a checkbox in Jquery.

Example :

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
SELECT Laptops:
<br />
<asp:CheckBox ID="CheckBox1" Text="HP" runat="server" /><br />
<asp:CheckBox ID="CheckBox2" Text="DELL" runat="server" /><br />
<asp:CheckBox ID="CheckBox3" Text="ACER" runat="server" /><br /><br />
<asp:Button ID="btnSubmit" runat="server" Text="Submit" />
</div>
</form>
</body>
</html>

1. to check atleast one checkbox should be checked from the list of checkboxes

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$('input[id$=btnSubmit]').click(function (e) {
var checked = $(':checkbox:checked').length; //checks whether atleast one check box is checked from the list of checkboxs.
if (checked == 0) {
alert('Select atleast one checkbox');
e.preventDefault();
}
else {
alert('all validations true');
}
});
});
</script>

2. to validate a specific checkbox

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$('input[id$=btnSubmit]').click(function (e) {
var checked = $('#CheckBox1').is(':checked'); // for a specific checkbox
if (checked == 0) {
alert('First Checkbox Should be checked');
e.preventDefault();
}
else {
alert('all validations true');
}
});
});
</script>

Thursday, August 29, 2013

Allow only decimal and float values in asp.net using asp RegularExpressionValidator control | Regular expression to validate float and decimal values example

Hi in this post i will show how to allow only decimal and float values in asp.net using regular expression.

In Aspx:

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

<asp:RegularExpressionValidator ID="ValidateTotalBillAmount" ErrorMessage="Enter Proper value" ControlToValidate="txtEmpSalary" ValidationExpression="(?<=^|)\d+(\.\d+)?(?=$|)|(?<=^| )\.\d+(?=$|)" runat="server">
</asp:RegularExpressionValidator>

In code-behind:

if (Page.IsValid = = false)
{
return;
}

if page has any error then it will return.