How to pass a php variable in window.open function

Question

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.com/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

In your while loop may be multiple id's so you want to pass multiple id to URL or single id only? — Sachin
– Sachin, Commented Apr 9, 2019 at 4:38

Nasik Ahd · Accepted Answer · 2019-04-09 04:50:07Z

4

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.com/pop.php?p_id="+id, "myWindow", "width=600,height=800");
        }
        function closeWin() {
            myWindow.close();
        }
</script>

edited Apr 9, 2019 at 4:50

answered Apr 9, 2019 at 4:40

Nasik Ahd

7981 gold badge10 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Nasik Ahd Over a year ago

can you upload a screen shot

Phil Over a year ago

I know OP said the ID is a three-digit number but you should still be mindful of XSS vulnerabilities with this, both when injecting it into the HTML and when using it in the window.open() URL

Prince Kumar Dwivedi · Accepted Answer · 2019-04-09 04:52:14Z

2

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.com/pop.php?id="+id, "myWindow", "width=600,height=800");
            }
            function closeWin() {
                myWindow.close();
            }
    </script>

answered Apr 9, 2019 at 4:52

Prince Kumar Dwivedi

2573 silver badges14 bronze badges

Comments

Phil · Accepted Answer · 2019-04-09 04:52:04Z

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.com/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.

vrooom · Accepted Answer · 2019-04-09 04:56:41Z

1

2 steps to follow

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

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.com/pop.php?id="+id, "myWindow", "width=600,height=800");
}
function closeWin() {
myWindow.close();
}
</script>

answered Apr 9, 2019 at 4:56

vrooom

511 silver badge11 bronze badges

Comments

Mayank Dudakiya · Accepted Answer · 2019-04-09 04:45:25Z

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.com/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>

Collectives™ on Stack Overflow

How to pass a php variable in window.open function

5 Answers 5

2 Comments

Comments

Comments

2 steps to follow

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

2 Comments

Comments

Comments

2 steps to follow

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related