JavaScript HTML and PHP pop-up window

Question

I have variable in PHP $idPost where it randomly get from database mysql.

The JavaScript below is included in the while process. I hope I can get multiply var in JavaScript too. But it doesnt seem work that way.

here my javascript base onclick event:

<img class="share" alt="1" src="comment.png" id="comment" onclick="myFunction()">
  <script>
    // Get the modal
    var modal = document.getElementById('myModal');
    // Get the button that opens the modal
    var btn = document.getElementById("comment<?php echo $idPost;?>");
    // Get the <span> element that closes the modal
    var span = document.getElementsByClassName("close")[0];
    //var idpost<?php echo $number;?> = document.getElementById("comment<?php echo $number;?>").alt;
    var textarea<?php echo $idPost;?> = 'hai<?php echo $idPost;?>';
    var a = "textarea";
    var b = "<?php echo $idPost;?>";
    var c = a+b;
    document.getElementById(c).value=textarea<?php echo $idPost;?>;

    // When the user clicks the button, open the modal
    function myFunction() {
      modal.style.display = "block";
    }

    // When the user clicks on <span> (x), close the modal
    span.onclick = function() {
      modal.style.display = "none";
    }

    // When the user clicks anywhere outside of the modal, close it
    window.onclick = function(event) {
      if (event.target == modal) {
        modal.style.display = "none";
      }
    }
</script>

My problem is in html :

<textarea class="form-control" rows="2" placeholder="Type Your Comment Here" name="content" id="textarea<?php echo $idpost;?>"></textarea>

Whenever I change into id="textarea45" (where 45 is the first idpost ) it works. But when I use $idpost it dosen't work.

I am confused about two things.

1. The textarea value in JavaScript gets the last $idpost , but in textarea id gets the first $idpost .

2. When I change from $idpost to some variable that I auto increament, the textarea id gets the last/biggest number, and the value in JavaScript gets the first/smallest number.

How can I use this code?

Answer 1

Try the Jquery modal open function

$("#myModal").modal();

You can use it in the button onclick function or anywhere

About php variables, You can use Ajax for getting the data from php. Better data format is JSON for your project