jQuery 특정 라디오 버튼 값을 선택했을 때 div를 다른 div로 표시합니다.

Question

그래서 블로그를 루프에서 데이터베이스에서 가져 오도록 설정했습니다. 각 게시물 (#post_)은 한 쌍의 라디오 버튼과 결합됩니다. 라디오 버튼이 선택되면, ajax는 값이 내 데이터베이스에 저장되는 check.php에 값을 보냅니다. 반환 된 html이 #Message_에 표시됩니다.

좋아요 라디오 버튼을 선택했을 때만 해당 div의 오른쪽 상단 모서리에 div (#Message_)가 나타납니다.

이것은 현재 라디오 버튼이 선택되었을 때 #Message를 표시하지만 #post 아래에만 표시하는 코드입니다. 루프 안에 앉아,

<div id="content"> 

<form name="myform" action="" method="post"> 
     <legend>Posts</legend> 

<?php 
$data = mysql_query("SELECT * FROM Posts"); 
while($row = mysql_fetch_array($data)){ 
?> 

JQuery와 자체 :

루프를 호출

<div id="post_<?php echo $row['postID']; ?>" class="post"> 
<div id="post_<?php echo $row['postID']; ?>_inside"> 
    <b><?php echo $row['Title']; ?></b><br> 
    Expires: <?php echo $row['Exp']; ?><br> 
    <ul id="listM"></ul> 

    <form id="form_<?php echo $row['postID']; ?>" action="/"> 
     <fieldset> 
      <div class="left"><p><input id="like_<?php echo $row['postID']; ?>" type="radio" name="pref_<?php echo $row['postID']; ?>" value="1"<?php if ($checked['value'] == "1") echo " checked"; ?> /> 
      <label for="like_<?php echo $row['postID']; ?>">Like</label></p></div> 
      <div class="right"><p><input id="dislike_<?php echo $row['postID']; ?>" type="radio" name="pref_<?php echo $row['postID']; ?>" value="0"<? if ($checked['value'] == "0") echo " checked"; ?> /> 
      <label for="dislike_<?php echo $row['postID']; ?>">Dislike</label></p></div> 
       <hr /> 
     </fieldset> 
    </form> 
</div> 
</div> 
<div id="Message_<?php echo $row['postID']; ?>"></div> 

루프를 종료 :

를

<script type="text/javascript"> 
$(document).ready(function() { 

    $("input[name*='pref_<?php echo $row['postID']; ?>']").click(function() { 
     var postID = <?php echo $row['postID']; ?>; 
     var value = $(this).val(); 
     var userID = <?php echo $current_user->ID; ?>; 

     $.ajax({ 
      url: 'check.php', 
      type: 'POST', 
      data: 'userID=' + userID + '&postID=' + postID + '&value=' + value, 
      success: function(result) { 
       $('#Message_<?php echo $row['postID']; ?>').html('').html(result); 
      } 
     }); 

    }); 

}); 
</script> 

표시 루프 내부의 게시물

<?php 
} 
?> 

</div> 

Answer 1

는 테스트하지하지만 당신은 내가 여기에 무슨 짓을했는지 알아낼 수 :이 싫어하는 선택한 경우에만 메시지를 표시 할 방법을 참조

<script type="text/javascript"> 
$(document).ready(function() { 

    $("input[name*='pref_<?php echo $row['postID']; ?>']").click(function() { 
     var postID = <?php echo $row['postID']; ?>; 
     var value = $(this).val(); 
     var likeDislike = $(this).id().toString().replace(/(.*)_(.*)/,'$1'); //get 'like or dislike' 
     var userID = <?php echo $current_user->ID; ?>; 

     $.ajax({ 
      url: 'check.php', 
      type: 'POST', 
      data: 'userID=' + userID + '&postID=' + postID + '&value=' + value, 
      success: function(result) { 
       if (likeDislike == 'like') { 
        //do like stuff 
        //move the message element into the post at the top, use CSS like float:right or text-align:right etc. to position it to the right 
        $('#Message_<?php echo $row['postID']; ?>').prependTo('#'+postID); 
       } 
       else if (likeDislike == 'dislike') { 
        //do dislike stuff 
        $('#Message_<?php echo $row['postID']; ?>').html('').html(result); 
       } 
      } 
     }); 

    }); 

}); 
</script>