CODEWITHSUNDEEP
phpjqueryhtmlinternet-explorer
Vinu
Vinu

Reputation: 167

HTML issues in IE

I have written a html code for login as follwing 

<div id="wrapper">
<div id="page">
    <div class="aLogin">
        <label>User Name : </label>
        <input type="text" class="lname" />
        <label>Password : </label>
        <input type="password" class="lpwd" />
        <input type="submit" class="logSubmit" value="LOGIN" />
        <p class="lalert">test alert</p>
    </div>
</div>

and written jQuery for validation.It replace the alert(here i used <p class="lalert">test alert</p>) dynamically.
The problem is, when i run this in IE, the alert message was displayed twice. But in other browsers no problem.

jQuery 

$(document).ready(function(){
   $('.logSubmit').click(function(){
    var name = $('.lname').val();
    var pwd = $('.lpwd').val();
    $.post("/login.php",{name:name,pwd:pwd}).success(function(data){
        var obj = jQuery.parseJSON(data);
        $('.lalert').fadeIn('slow');
        if(obj.success == 1){
            $('.lalert').css('color','#067800');
            $('.lname').val('');
            $('.pwd').val('');
            $('.lalert').html(obj.msg);
        }else{
            $('.lalert').css('color','#CC0000');
            $('.lalert').html(obj.msg);
        }
    });
  });
});

login.php 

 <?php
   $name = $_POST['name'];
   $pwd = $_POST['pwd'];
   $err['success'] = 0;
   $err['msg'] = '';
   if($name != 'admin'){
   $err['msg'] = 'Invalid Name';
   }else if($pwd != 'admin'){
   $err['msg'] = 'Invalid Password';
   }else{
   $err['success'] = 1;
   $err['msg'] = 'Success';
   }
   echo json_encode($err);
?>

I can't found why this happening. Can anybody help me..?

Upvotes: 7

Views: 355

Answers (4)

Vinu
Vinu

Reputation: 167

Finally i got the solution.The problem happens due to Empty Text Node. IE8 generates Empty Text Node for line breaks after <input>,<select>,<img> tags.

I removed that spaces after the tags and now the problem solved

Upvotes: 0

Hemant Kumar
Hemant Kumar

Reputation: 4611

Hi You have forgot to write the "return false".

$('.logSubmit').click(function(){ 
    var name = $('.lname').val(); 
    var pwd = $('.lpwd').val(); 
    $.post("/login.php",{name:name,pwd:pwd}).success(function(data){ 
        var obj = jQuery.parseJSON(data); 
        $('.lalert').fadeIn('slow'); 
        if(obj.success == 1){ 
            $('.lalert').css('color','#067800'); 
            $('.lname').val(''); 
            $('.pwd').val(''); 
            $('.lalert').html(obj.msg); 
        }else{ 
            $('.lalert').css('color','#CC0000'); 
            $('.lalert').html(obj.msg); 
        } 
    }); 
      return false;
  });

Upvotes: 1

Sridhar
Sridhar

Reputation: 11

try to use instead of using $('.logSubmit').click(function(){ ...}

use below syntax

$('.logSubmit').unbind('click').click(function(){ .....}

this may resolve the issue.

Upvotes: 0

heikkim
heikkim

Reputation: 2975

Try adding return false; to your .logSubmit -click binder. Also, you could try replacing the submit-typed input with a <button> since submits are related to forms (submitting) and this is not the case in your situation.

Upvotes: 0

Related Questions