Probably a very simple answer, but I cannot seem to find a working solution. I am creating links from a php search script and it generates links based on query. I have written a sample jQuery script to open a div based on a tag being clicked, but when I click link, nothing happen. I cannot see any errors in firebug and would appreciate somke help. Thank you.
UPDATE: Added html and changed mailLink from id to class.
jQuery
$("a").click(function(e) {
e.preventDefault();
$('.mailShow').fadeIn(1500).html('This is the mailShow div');
});
PHP
<?php
while ($row = mysql_fetch_assoc($rsd))
{?>
<div class="each_rec"><a href="#" class="mailLink"><?php echo $row['name_usr'];?> <?php echo $row['idcode_usr'];?></a></div>
<?php
}
if($total==0){ echo '<div class="no-rec">No Record Found !</div>';}
?>
HTML
<div id="content">
<div class="search-background">
<label><img src="loader.gif" alt="" /></label>
</div>
<div id="sub_cont">
<div class="mailShow"></div>
</div>
</div>
Generated HTML from firebug
<div class="each_rec"><a href="#" class="mailLink">Demo User DEMO</a></div>
In jquery you have .mailShow
and in PHP you use id="mailLink"
. You should change .mailShow
to #mailLink
.
JSFiddle for testing.
Try this code:
$(document).ready(function () {
$(document).on("click","a",function(e) {
e.preventDefault();
$('.mailShow').fadeIn(1500).html('This is the mailShow div');
});
});
<?php
while ($row = mysql_fetch_assoc($rsd))
{?>
<div class="each_rec"><a href="#" class="mailLink"><?php echo $row['name_usr'];?> <?php echo $row['idcode_usr'];?></a></div>
<?php
}
if($total==0){ echo '<div class="no-rec">No Record Found !</div>';}
?>
I see two probable issues: 1. You didn't use $(document).ready(); and put your code outside of it. Then you need to put the above code to docyument ready. 2. You inseert links dinamycaly - from ajax query. Thus you need to use jquery delegates instead.