<div class="row" id="loginrow" style="display:none;">

    <div class="col-md-3"></div>
    <div class="col-md-6">


        <div class='panel panel-primary'>
    <div class='panel-heading'>
        <h3 class="panel-title">Saliq Software Solutions-SMS Platform</h3>

    </div>
            <div id='alert-box'></div>
    <div class="panel-body">
        <form role="form" id='login-form' action="validatelogin.php" method="post">

  <div class="form-group">
    <label for="username">Email Adress:</label>
    <input type="text" class="form-control" id="uname" name='uname'>

  </div>
  <div class="form-group">
    <label for="pwd">Password:</label>
    <input type="password" class="form-control" id="pwd" name='pwd'>
  </div>
           <div class="form-group text-right">
           <button type="button" class="btn btn-primary" id='login' name='login'>Login</button>
           </div>

</form>


   </div>






    </div>
    <div class="col-md-3"></div>

</div>

</div>
<script>
    $(document).ready(function(){

$('#uname').keypress(function (e) {
 var key = e.which;
 if(key == 13)  // the enter key code
  {
    $('#pwd').focus();
    return false;
  }
});

$('#pwd').keypress(function (e) {
 var key = e.which;
 if(key == 13)  // the enter key code
  {
    $('#login').click();
    return false;
  }
});


        $("#login").click(function(){
          $("#alert-box").html('');
           //alert("Clicked");
            var mydata=$("#login-form").serialize();
           //alert(mydata);
             $.ajax({
	        type:"POST",url:"validate.php",data:mydata
	        ,cache:false,
	        beforeSend:function(){
	        	$("#login").html('<span id="spinoff" class="glyphicon"></span>Loading....');
$("#spinoff").addClass("glyphicon-refresh glyphicon-refresh-animate");
//$("#viewclass").disable(true);

		        },
	        success:function(response){
		      //  alert(response);
                        var resp=jQuery.parseJSON(response);
                        var status=resp.status;
                        var msg=resp.mesaage;
                        if(status=='success'){
                            $("#loginrow").hide();
                            $("#content_zone").show();
                            //get_instatus();
                        }else{
                            document.getElementById("alert-box").innerHTML="<div class='alert alert-danger'><strong>Failed!</strong> Login Failed.Invalid UserName and or Password."+msg+"</div>";
                        }
	            },
	            complete:function(){
                        //alert(rep);
	            	$("#login").html("Login");
	            	$("#spinoff").removeClass("glyphicon-refresh glyphicon-refresh-animate");
	            	//$("#viewclass").disable(false);
		            }

	        });//end of ajax call
        });


      


    });

</script>
