Google+ Followers


Get Updates Via Email

Enter your email address:

Delivered by FeedBurner

Sunday, 22 June 2014

Input Text Validation using BootStrap CSS and JQuery

HTML Code:

<!DOCTYPE html>
<script src=""></script>
<link href="" rel="stylesheet" type="text/css" />
<script src=""></script>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta charset="utf-8">
  <title>Text Input Validation</title>
  <strong>Enter any Data:<strong><br/>
<input type="text" class="btn-lg btn-default" id="test"/>
  <span id='testvalid'></span>

JQuery Script Code

  //Blur Event checks the input field when it loses focus
    //checks text value empty
     $('#test').addClass("btn-lg btn-danger");
      $('#testvalid').html("<span style='color:white;background-color:maroon;border-radius:7px;border-width:10px;box-shadow: 3px 3px 5px #999'>&nbsp; &#x2717 &nbsp;</span>");   
      $('#test').addClass("btn-lg btn-default");
  //keyup event checks user giving entering data




Click here to Live Preview

1 comment :

  1. I have read your blog its very attractive and impressive. I like it your blog.

    Java Online Training Java EE Online Training Java EE Online Training Java 8 online training Core Java 8 online training

    Java Online Training from India Java Online Training from India Core Java Training Online Core Java Training Online Java Training InstitutesJava Training Institutes


Share this to your friends