I have PHP loop ( WHILE{} ) that loops an array from MySQL and creates a page with the data line by line. I need to add to each line a button that will trigger a new page but I need to carry the value of the id of the line to that new pop-up page. This is the code I have, but i can't figure out how to pass my id to the pop up:

I know I can't add my PHP variable to the URL in the JS function, because it sits outside the loop. Can I use the JS function to add it ? Here is some simplified code:

PHP Code

<?php
    while ($all = mysql_fetch_array($get_all)){

        $id= $all['id'];

        echo '<button type='button' class='btn btn-danger' onclick='openWin()'>  Click here</button> ';

    }
?>

Javascript

<script>
        var myWindow;

        function openWin() {
            myWindow = window.open(".php", "myWindow", "width=600,height=800");
        }

        function closeWin() {
            myWindow.close();
        }
</script>

I need to get $id to the new page. As stated I was hoping to add it to the URL as a $_GET variable, but I don't seem to know how to add it since the url sits in the JS function outside the while loop.

Sorry for the poor indenting

I have PHP loop ( WHILE{} ) that loops an array from MySQL and creates a page with the data line by line. I need to add to each line a button that will trigger a new page but I need to carry the value of the id of the line to that new pop-up page. This is the code I have, but i can't figure out how to pass my id to the pop up:

I know I can't add my PHP variable to the URL in the JS function, because it sits outside the loop. Can I use the JS function to add it ? Here is some simplified code:

PHP Code

<?php
    while ($all = mysql_fetch_array($get_all)){

        $id= $all['id'];

        echo '<button type='button' class='btn btn-danger' onclick='openWin()'>  Click here</button> ';

    }
?>

Javascript

<script>
        var myWindow;

        function openWin() {
            myWindow = window.open("http://www.website./pop.php", "myWindow", "width=600,height=800");
        }

        function closeWin() {
            myWindow.close();
        }
</script>

I need to get $id to the new page. As stated I was hoping to add it to the URL as a $_GET variable, but I don't seem to know how to add it since the url sits in the JS function outside the while loop.

Sorry for the poor indenting

• javascript
• php

• The nested single-quotes in your echo are invalid – Phil Commented Apr 9, 2019 at 4:38
• In your while loop may be multiple id's so you want to pass multiple id to URL or single id only? – Sachin Commented Apr 9, 2019 at 4:38
• single id ..it'a 3 digit number – zefrank Commented Apr 9, 2019 at 4:42

5 Answers 5

just pass a parameter

while ($all = mysql_fetch_array($get_all)){

 $id= $all['id'];
 echo '<button type="button" class="btn btn-danger" onclick="openWin(\''.$id.'\')">  Click 
   here</button> ';
}



<script>
        var myWindow;
        function openWin(id) {
            myWindow = window.open("http://www.website./pop.php?p_id="+id, "myWindow", "width=600,height=800");
        }
        function closeWin() {
            myWindow.close();
        }
</script>

hope it will work for you.

while ($all = mysql_fetch_array($get_all)){
    ...
    $id= $all['id'];
    echo "<button type='button' class='btn btn-danger' onclick='openWin($id)'>  Click here</button>";
    ...
    }

    <script>
            var myWindow;
            function openWin(id) {
                myWindow = window.open("http://www.website./pop.php?id="+id, "myWindow", "width=600,height=800");
            }
            function closeWin() {
                myWindow.close();
            }
    </script>

Add the id as an attribute of your HTML <button> element and pass that to the openWin function, eg

while ($all = mysql_fetch_array($get_all)) : ?>
<button type="button" class="btn btn-danger" onclick="openWin(this.dataset.id)"
        data-id="<?= htmlspecialchars($all['id']) ?>">
  Click here
</button>
<?php endwhile ?>

and in your JS

function openWin(id) {
  myWindow = window.open(
      `http://www.website./pop.php?id=${encodeURIComponent(id)}`,
      'myWindow',
      'width=600,height=800'
  )
}

I've used an HTML attribute to store the value (as opposed to just injecting it into the onclick expression) to avoid the issue of having to simultaneously HTML and JS encode the value.

I've also used data-id instead of just id because a 3-digit number makes a bad HTML element ID, prone to easy conflicts.

2 steps to follow

1. Pass your php variable $id to javascript function using function-call-by-value reference,

2. then use that argument in GET request for url to be opened in new window

   $id= $all['id'];
   echo "<button type='button' class='btn btn-danger' onclick='openWin(".$id.")'>  Click     here</button> ";
   
   }
   ?>
   <script>
   var myWindow;
   function openWin(id) {
   myWindow = window.open("http://www.website./pop.php?id="+id, "myWindow", "width=600,height=800");
   }
   function closeWin() {
   myWindow.close();
   }
   </script>
   

Use cookies or HTML5 localStorage if its purely on the client-side.

Simple jQuery (Pass as a query string in the URL)

<script>
        var myWindow;
        function openWin(id) {
            myWindow = window.open("http://www.website./pop.php?p_id="+id, "myWindow", "width=600,height=800");
        }
        function closeWin() {
            myWindow.close();
        }
</script>

Example 2 Simple jQuery (Pass as a query string in the URL via function)

function set_url_data(go_to_url, data) {
  new_url = go_to_url + '?data=' + data;
  window.location.href = new_url;
}

LocalStorage

//Set data

    localStorage.setItem('bookedStatus' + customerId, true);

    //Get data

    localStorage.getItem('bookedStatus');

Ajax

<script>
     $.ajax({
       type: "POST",
       url: package.php,
       data: $("#myform").serialize(), 
       success: function(data)
       {
           $('#Result').html(data); 
       }
    });
</script>