after ajax call jquery function not working properly

Question

headers :

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/timeago.js" ></script>
 <script src="js/test_helpers.js" type="text/javascript"></script>

photos.php

$(".cmdclose").click(function(){

    var id=this.id;

    $.post("cmddel.php" ,{"id":id});
        setTimeout(function(){      
        <?php echo 'var id = '.json_encode($_GET['id']).';'; ?>
        $('#cmdz').load('cmdajax.php?id='+id);      
    },1000);

});

html part:

<div id="cmdz"> 
    <?php
    $uid=$_SESSION['uid'];
    $query="SELECT *
    FROM `cmds`
    WHERE `pid` =${id} ORDER BY `id`";
    $result=$db->query($query);
    ?>

    <table id="tblcmd">
        <tr>

    <?
    while($result_set=$db->fetch($result)){
        // echo $result_set['cmds'];
        $uid=$result_set['uid'];

        $query2="SELECT * FROM `user` WHERE `id` ='${uid}'";

        $result2=$db->query($query2);
        $result_set2=$db->fetch($result2);


        echo '<td>'.$result_set2['name'].'</td>'; 

        echo '<td>:'.$result_set['cmds'].'</td>';
        echo '<td  id="'.$result_set['id'] .'"><img src="images/cmd-close.jpg" class="cmdclose" id="'.$result_set['id'] .'" /> </td>'; 

        ?>
        </tr>
        <?php
    }
    ?>

    </table>

</div>

cmdajax.php

<?php
    session_start(); 
    require_once("includes/database.php");
    if(isset($_GET['id'])){
        $id=$_GET['id'];
    }

    $uid=$_SESSION['uid'];
    $query="SELECT * FROM `cmds` WHERE `pid` =${id} ORDER BY `id`";

    $result=$db->query($query);
?>

<table id="tblcmd">
    <tr>
    <?php
    while($result_set=$db->fetch($result)){
    // echo $result_set['cmds'];
    $uid=$result_set['uid'];

    $query2="SELECT * FROM `user` WHERE `id` ='${uid}'";

    $result2=$db->query($query2);
    $result_set2=$db->fetch($result2);

    echo '<td>'.$result_set2['name'].'</td>'; 
    echo '<td>:'.$result_set['cmds'].'</td>'; 
    echo '<td  id="'.$result_set['id'] .'"><img src="images/cmd-close.jpg" class="cmdclose" id="'.$result_set['id'] .'" /> </td>'; 
    echo '<td><abbr class="timeago" title="2008-07-17T09:24:17Z">July 17, 2008</abbr></td>'; 
    ?>
    </tr>
    <?php
    }
    ?>

         </table>

My problem is that, after one page refresh or Ajax call, the function $(".cmdclose").click(function() will not work. Why not?/// this problem resolved

now i am facing this problem:

jQuery("abbr.timeago").timeago(); this selector won't work properly what will be the reson? Thanks

Shyju · Accepted Answer · 2012-06-18T13:25:32.693

Because you bounded the functionality of the click event even before the new content is injected to the DOM. So that functionality will not be available to the newly added (injected) dynamic content. To handle this , you need to use jQuery on

So Change your code from

$(function(){
   $(".cmdclose").click(function(){    
     // your code    
   });
});

to

$(function(){
    $(document).on("click",".cmdclose",function(){
       //your code
    });
});

jQuery on will work for current and future elements. on is avaialbe from jQuery 1.7+ onwards. If you are using a previous version of jQuery, use live

mgraph · Answer 2 · 2015-04-17T16:36:05.843

5

try:

$(".cmdclose").live("click",function(){...

edited Apr 17 '15 at 16:36

answered Jun 18 '12 at 13:20

mgraph

15,238
4
41
75

1

$(".cmdclose").live("click",function(){ This worked perfectly thanks – sudeep cv Jun 18 '12 at 13:28

score 2 · Answer 3 · edited Jun 18 '12 at 13:51

2

problem in your jquery code your code like this.

$(".cmdclose").click(function()

problem is "cmdclose" this class is not available in your html par.

so first you need to specify the this class in html tag like div,tr etc.

after that its working plz try this

edited Jun 18 '12 at 13:51

Thiem Nguyen

6,345
7
30
50

answered Jun 18 '12 at 13:27

user1107107

44
2

after ajax call jquery function not working properly

3 Answers3

Linked