값이 한 번만 업데이트됩니다. 내 jquery 코드에 문제가 있습니까?

Question

사용자가 이미지를 클릭하여 사용자를 차단/차단 해제 할 수있는 표가 있습니다. 이건 이런거야. 난 JQuery와 데이터 테이블 플러그인을 사용하고 같은

(블록/해제에 대한 열을 포함) 테이블의 HTML는 AJAX로 검색된다. 여기

는 열 블록에 대해 상기 검색된 HTML은/값의 경우, 데이터 테이블의 블록/해제 블록의 상태를 나타낸다

<td> 
    <a class="toggle" href="#toggle"> 
     <img src="app/css/images/tick.png" alt="Yes" data-id="4" data-block="0"> 
    </a> 
</td> 

차단을 0 그것은 화상 tick.png가 (활성화)이라고 보여 else tock.png (비활성화 됨).

다음 jQuery를 사용하여 클릭을 캡처하고 변경 사항을 얻기 위해 서버 측으로 데이터를 보냅니다.

$('.toggle').live('click', function() { 
    var id = $(this).find('img').data('id'); 
    var block = $(this).find('img').data('block'); 
    $.ajax({ 
     type: 'POST', 
     url: "app/ajax/User/Block.php", 
     data: 'id='+id+'&block='+block, 
     success: function(data) { 
      var image = (data == 1) ? 'app/css/images/tock.png' : 'app/css/images/tick.png'; 
      $('.toggle img[data-id="'+id+'"]').attr('data-block', data); 
      $('.toggle img[data-id="'+id+'"]').attr('src', image); 
     } 
    }); 
}); 

여기는 내가 사용하고있는 PHP 코드입니다. 내가 다시는 아무것도하지 않습니다 같은 이미지를 클릭하면 전, 한 번만 클릭 할 수있는 data-block 값이 업데이트됩니다 같은 문제가 있으므로 이미지가 상태를 전환 클릭하면

if(isset($_POST['id']) && isset($_POST['block'])) { 
    $userId = $_POST['id']; 
    //$_POST['blocks'] holds the current value of block/unblock. 
    //toggle the block/unblock state. 
    $block = $_POST['block'] == 1 ? 0 : 1; 
    User::blockUser(array($userId), $block); 
    //Respond back toggled block/unblock value. 
    echo $block; 
} 

모든 것이 잘 작동합니다. 콘솔에서 값을 확인했는데 값이 처음 클릭 한 후에도 업데이트되지 않습니다. 코드에 어떤 문제가 있습니까?

는 업데이트 : 여기

은 클릭하기 전에 즉 전에 첫 번째 단계에서 HTML입니다.

<a class="toggle" href="#toggle"> 
    <img src="app/css/images/tick.png" alt="Yes" data-id="4" data-block="0"> 
</a> 

여기에 같은 행을 클릭하면 HTML이 표시됩니다.

<a class="toggle row_selected" href="#toggle"> 
    <img src="app/css/images/tock.png" alt="Yes" data-id="4" data-block="1"> 
</a> 
//Here the extra class row_selected is added by default by another plugin, do you think this is creating the problem? 

그리고 여기서는 첫 번째 클릭 이후입니다.

<a class="toggle" href="#toggle"> 
    <img src="app/css/images/tock.png" alt="Yes" data-id="4" data-block="1"> 
</a> 

Answer 1

jQuery를 자체 데이터 구현이있다 : 당신은 당신이 $('.toggle') 같은 수준의 검출을위한 jQuery를 사용하지 말아야 또한 $(this).find('img').data('block')

그것을 읽을

이

대신 .attr('data-block', data); 의 .data('block', data);를 사용해야합니다 당신의 경우 태그를 알아. 예제에서 성능을 쉽게 향상시킬 수 있습니다. $('a.toggle')