PHP and Javascript with multiple PHP GET var's

[Steveo31]

I'm not lookin for the exact code, I would just like to know what I need to lookup for this. I know a little JS and I am making a photo website in PHP. The photos will have a link on them similar to:

<a href="index.php?image=imageName&orientation=v"><img src= ....

Now, I know a bit of PHP concerning $_GET variables, but not multiple "get"'s. Are both of the variable names "image" and "orientation" (in this case) accessible by $_GET[]?

Once I figure that out, I would like to make a function in javascript that will open a new window, with the image inside and a description. I would like to have it open a window sized based on the orientation variable in the URL. Is it possible to have the window opened and sized based on the orientation?

For example, lets say the image link is

<a href="index.php?image=sunset&orientation=h"><img src=___ /></a>

The image is called "sunset" and it is a horizontal image. From there, have a javascript function open a window for a horizontal orientation e.g. 500x230. From there, have PHP fill the page with the appropriate info.

Any ideas would be greatly appreciated.

[sad69]

Ok you have to take a step back and break this into a couple of steps.

First, I'll answer your questions:

Now, I know a bit of PHP concerning $_GET variables, but not multiple "get"'s. Are both of the variable names "image" and "orientation" (in this case) accessible by $_GET[]?

Yes. Depending on the link clicked, different values will be sent to the PHP page, and accessing the variable using $_GET will give your the appropriate values.

Is it possible to have the window opened and sized based on the orientation?

Yes. This is where we have to understand the steps.

You'll have to open the window to the size that you want first (using Javascript), then load that window with the PHP file which will display the picture and description.

Passing the orientation variable to the PHP page won't give you the desired results (ie. PHP can't open a window, so this has to be done in Javascript).

You should create a Javascript function on your page with the links that will open the window appropriately.

Try something like this:

function openWindow(orientation, url) {
 var w = 0;
 var h = 0;

 if(orientation.match("h")) {
  w = 500;
  h = 230;
 }
 else { //edit these values as necessary...
  w = 230;
  h = 500;
 }

 window.open(url,'pic','width='+w+',height='+h+',resizable,scrollbars,status');
}

<a href="#" onClick="openWindow('v', 'index.php?image=imageName&orientation=v')"><img src= ....

That should make sense and do what you're looking for.

Hope that helps,
Sadiq.

[Steveo31]

Looks good man, thanks for the reply.

I'll do a quickie and see how it goes.

[Steveo31]

Alrighty. Did a bit more research and planning, and here's my problemo.

I have the basis for what I need to have the JS function to do (see 2 posts up). I understand the function okay... thanks much. I just want to make sure it can do what I need it to. I would like to learn, so I'm not looking for the exact answer...

In the php page that the JS function will open, I assume I need something like the following:

<table>
    <tr>
        <td><img src="<?php echo $_GET['imageName'] ?>" alt="" /></td>
    </tr>
</table>

Correct?

Thanks so much.

[sad69]

Almost,

PHP Code:

<table>
 <tr>
  <td><img src="<?php echo $_GET['image'] ?>" alt="" /></td>
 </tr>
</table>

Since the url is:
'index.php?image=imageName&orientation=v'

So because it is image= then image is the variable.

Hope that helps,
Sadiq.

[Steveo31]

Ah, yea... I thought the get var was imageName, not image. Thanks.

[Willy Duitt]

I don't know why you need to even pass the orientation
when you can use javascript to open the window to the size of
the image, whatever size it is.

Something like this should work:
(may need additional work regarding passing the PHP variable)

<script type="text/javascript">
 <!--//
  function newImg(which){
   var theImg = new Image();
       theImg.src = which;
   var imgw = theImg.width;
   var imgh = theImg.height;

    if(imgw<100){imgw = 100};
    if(imgh<100){imgh = 100};

     var ImgWin = window.open('','imgwin',config='height='+imgh+',width='+imgw+',top=0,left=100')
       with(ImgWin.document){
        writeln('<html><head><title>Display Image</title></head>');
        writeln('<body onload="self.focus()" onblur="self.close()">');
        writeln('<div style="position:absolute;top:0;left:0">');
        writeln('<img src='+which+'border="0"></div>');
        writeln('<div style="text-align:center;font-size:9px">');
        writeln('<a href="#" onClick="self.close()">Close Me</a>');
        writeln('</div></body></html>');
        close();
       }
  }
 //-->
</script>
</HEAD>

<BODY>
<a href="<?php echo $_GET['image'] ?>" alt="" onclick="newImg(this.href);return false">
<img src="dynamicbook1.gif"></a>

.....Willy

Edit: Tried to fix horizontal page scroll.