Zain Farooq Zain Farooq - 3 months ago 19
HTML Question

HTML anchor tag is not working after e.preventDefault()?

When I add

e.preventDefault();
in jQuery post method, dynamically generated anchor tag is not working.


This is jquery code:



$(document).ready(function(){
$('.img-rounded').on('click',function(e){
e.preventDefault();
$.post("LikeMail.php",
{fname: this.id}
);
});
});


This HTML code:

<a href="<?php echo "viewProfile.php?id=" . $record['user_id'];?>" >
<img class="img-rounded"
src=" <?php echo "../shadi/images/" . $record['user_photo1'] ?>"
id="<?php echo $record['user_id']; ?>"alt="" width="70%" height="20%">
</a>


I want to know that what is the problem there.

THIS IS LikeMail.php

<?php
session_start();
?>
<?php

if(!isset($_SESSION['login'])) {
echo "";


}
else {

include("db.php");
$user1 = $_SESSION['user_id'];
// echo $user1;


//This is being received from jquery

$user2 = $_POST['fname'];

//$lname = $_POST['surname'];


//echo $lname;
/*$sql = "UPDATE notification SET alert='$fname' WHERE id = '1'";
if(mysqli_query($conn,$sql))
echo "updated";*/


$check_for_likes = mysqli_query($conn, "SELECT * FROM liked WHERE user1='$user1' AND user2='$user2'");
$numrows_likes = mysqli_num_rows($check_for_likes);
if (false == $numrows_likes) {
echo mysqli_error($conn);
}

if ($numrows_likes >= 1) {
echo '<input type="submit" value="Unlike" id="Unlike" class="btn btn-lg btn-info edit">';


}
if ($numrows_likes == 0) {
echo '<input type="submit" value="Like" id="Like" class="btn btn-lg btn-info edit">';
}


}?>
<div class="respond"></div>


IMAGE OF ERROR

THIS IS test.js code where ajax function is calling

function like()
{
var req = new XMLHttpRequest();
req.onreadystatechange = function()

{
if(req.readyState==4 && req.status==200)
{
document.getElementById('Like').innerHTML=req.responseText;

}
}
req.open('GET','LikeMail.php','true');
req.send();
}
setInterval(function(){like()},1000);




While user2.js is same as above jquery method

Answer

@Zain Farooq please make your question more specific i.e what you want to achieve? If e.preventDefault() is used then the default action of the event will not be triggered i.e, like in your case the anchor tag will not work.

EDIT1: If you want to send some data using post method on other page and then only anchor tag to work then you can use following code:

I have made some changes as:

<a class="profile" href="<?php echo "viewProfile.php?id=" . $record['user_id'];?>" >
  <img class="img-rounded"  
  src=" <?php echo "../shadi/images/" . $record['user_photo1'] ?>"  
  id="<?php echo $record['user_id']; ?>"alt="" width="70%" height="20%">
</a>

And then Your JQuery code will looks like:

$(document).ready(function () {

                $('.profile').on('click', function (e) {

                    //Get the href Link
                    var href = $(this).attr('href');

                    e.preventDefault();
                    $.post("LikeMail.php",
                             {fname: $(this).find(".img-rounded").attr("id")}

                    ).done(function () {
                     //Redirecting to anchor destination.
                        window.location.href = href;

                    });
                });
            });

EDIT2: I don't get your question but if you want to check the response of post request you can use following code.

$(document).ready(function () {
                $('.profile').on('click', function (e) {

                    //Get the href Link
                    var href = $(this).attr('href');

                    e.preventDefault();
                    $.post("LikeMail.php",
                            {fname: $(this).find(".img-rounded").attr("id")}, function (returnedData) {

                        // Do whatever you want with returend data  
                        console.log(returnedData);

                    }).done(function () {

                        //Redirecting to anchor destination.
                        //window.location.href = href;


                    });

                });

            });
Comments