Toggle Show Hide-0Javascript

[JanMolendijk]

Hello CoursesWeb,

I have sql document with 4 results from-out database.
But I can`t open the results from the post_id ????

What do I do wrong ?

Code: Select all

<script>
$(document).ready(function() {
  // when click on the tag with id="btn"
  $('#btn11'.$row['post_id'].'').click(function() {
    // change the state of the "#idd"
    $('#idd11'.$row['post_id'].'').toggle(800, function() {
      // change the button text according to the state of the "#idd" 
      if ($('#idd11'.$row['post_id'].'').is(':visible')) {
        $('#btn11$row['post_id']').text('Hide');
      } else {
        $('#btn11'.$row['post_id'].'').text('Show');
      }
    });
  });
});
</script>

Code: Select all

<div id="idd11'.$row['post_id'].'" style="display:none;">

<?php echo $row['post_text'] ?>

</div>

<button id="btn11'.$row['post_id'].'">Hide</button>

Try the following code. See the differences.

Code: Select all

<?php
echo '<div id="idd11'. $row['post_id'] .'" style="display:none;">';
echo $row['post_text'];
echo '</div>
<button id="btn11'. $row['post_id'] .'">Hide</button>';
?>

<script>
var post_id_php = <?php echo $row['post_id']; ?>;
$(document).ready(function() {
  // when click on the tag with id="btn"
  $('#btn11'+ post_id_php).click(function() {
    // change the state of the "#idd"
    $('#idd11'+ post_id_php).toggle(800, function() {
      // change the button text according to the state of the "#idd" 
      if ($('#idd11'+ post_id_php).is(':visible')) {
        $('#btn11'+ post_id_php).text('Hide');
      } else {
        $('#btn11'+ post_id_php).text('Show');
      }
    });
  });
});
</script>