943,946 Members | Top Members by Rank

Web Development > PHP > option dropdown can't see options
Ad:
  • PHP Discussion Thread
  • Unsolved
  • Views: 2019
  • PHP RSS
Permalink
Jan 13th, 2007
0

option dropdown can't see options

Expand Post »
Hey everyone, am having problem with some php code in a plugin I'm using on my Wordpress site. The problem is that there is an option box that lets you select from among a list of files in a certain directory on my site, and you can't see the options. Well, you can only see the first couple letters of each file name, because the option box is acting like it has no info in it, all closed up. I should mention, that the box works fine in Firefox, the problem occurs in IE6 and IE7 (of course).

Here is the code for the select portion:
[PHP]
<select name="rh_image" onchange="previewImage(this.options[this.selectedIndex].value);" style="width:30%">
<option value="">Choose an image</option>
<?php
$image_dir = @dir(get_template_directory().'/images');
if ($image_dir) {
$img_dir_uri = get_template_directory_uri().'/images';
while(($file = $image_dir->read()) !== false) {
if ( preg_match('/\w*(\.jpg|\.gif|\.png)$/', $file) )
printf('<option value="%1$s/%2$s">%2$s</option>',$img_dir_uri,$file);
}
}
?>
</select>
[/PHP]
First of all, there is some JavaScript, which I'm not too knowledgeable on yet, but maybe someone could explain the php code that he is using to display the file names in the option box? I can kind of follow it, but I'm still getting lost.

But anyway, I just need to know how to get the box to display properly in IE.
Thanks.

Edit: Oh, by the way, just in case you're wondering, yes, I have posted this question on the wordpress site, and even on the plugin's site, but am getting no responses. This forum is much more helpful for issues like this.
Last edited by nathanpacker; Jan 13th, 2007 at 2:35 am.
Similar Threads
Reputation Points: 10
Solved Threads: 0
Posting Whiz in Training
nathanpacker is offline Offline
234 posts
since May 2005
Permalink
Jan 13th, 2007
0

Re: option dropdown can't see options

You'll need to view the output of the php to the page. (view-source on the browser).
You can then see what is causing the problem with IE.

As it looks, there should not be a problem.

What the code does is iterate through each image in the image directory of the template being used.

Then it writes out the options for the select element with:

[php]
printf('<option value="%1$s/%2$s">%2$s</option>',$img_dir_uri,$file);
[/php]

This is the same as:

[php]
echo '<option value="'.$img_dir_uri.$file.'">'.$file.'</option>';
[/php]

If you post the HTML source of the page, it will be easier to see the problem.
Last edited by digital-ether; Jan 13th, 2007 at 3:18 am.
Moderator
Reputation Points: 457
Solved Threads: 101
Nearly a Posting Virtuoso
digital-ether is offline Offline
1,250 posts
since Sep 2005
Permalink
Jan 13th, 2007
0

Re: option dropdown can't see options

Well, viewing the Source code in IE, here is what you get. (I'm assuming you just mean the source code of the portion itself, not the whole page.

PHP Syntax (Toggle Plain Text)
  1. <select name="rh_image" onchange="previewImage(this.options[this.selectedIndex].value);" style="width:30%">
  2. <option value="">Choose an image</option>
  3. <option value="http://www.packerworld.com/path to file/audio.jpg">audio.jpg</option>
  4. <option value="http://www.packerworld.com/path to file/kubrickbg.jpg">kubrickbg.jpg</option>
  5. <option value="http://www.packerworld.com/path to file/kubrickbgcolor.jpg">kubrickbgcolor.jpg</option>
  6. <option value="http://www.packerworld.com/path to file/kubrickbgwide.jpg">kubrickbgwide.jpg</option>
  7. <option value="http://www.packerworld.com/path to file/kubrickfooter.jpg">kubrickfooter.jpg</option>
  8. <option value="http://www.packerworld.com/path to file/kubrickheader.jpg">kubrickheader.jpg</option>
  9. <option value="http://www.packerworld.com/path to file/personalheader.jpg">personalheader.jpg</option>
  10. <option value="http://www.packerworld.com/path to file/image_frame.png">image_frame.png</option>
  11. <option value="http://www.packerworld.com/path to file/kubrickheader_pic.jpg">kubrickheader_pic.jpg</option>
  12. <option value="http://www.packerworld.com/path to file/personalheader_no_logo.jpg">personalheader_no_logo.jpg</option>
  13. <option value="http://www.packerworld.com/path to file/maddiecamera_copy.jpg">maddiecamera_copy.jpg</option>
  14. <option value="http://www.packerworld.com/path to file/maliyah_maddie.jpg">maliyah_maddie.jpg</option>
  15. <option value="http://www.packerworld.com/path to file/1_maddie.jpg">1_maddie.jpg</option>
  16. <option value="http://www.packerworld.com/path to file/2_maddie.jpg">2_maddie.jpg</option>
  17. <option value="http://www.packerworld.com/path to file/3_maddie.jpg">3_maddie.jpg</option>
  18. <option value="http://www.packerworld.com/path to file/4_familyjpg.jpg">4_familyjpg.jpg</option>          
  19. </select>

As you said, it looks like it is doing everything right, and it probably is, because firefox reders it correctly. However in IE, it still is acting weird. I just uploaded a screenshot of what it is doing. This is what it looks like when you click the drop down box to view all the files:
http://www.packerworld.com/nate_personal/select.JPG
Reputation Points: 10
Solved Threads: 0
Posting Whiz in Training
nathanpacker is offline Offline
234 posts
since May 2005
Permalink
Jan 13th, 2007
0

Re: option dropdown can't see options

Must be the style="width:30%".

Remove that and see if it helps...
Moderator
Reputation Points: 457
Solved Threads: 101
Nearly a Posting Virtuoso
digital-ether is offline Offline
1,250 posts
since Sep 2005
Permalink
Jan 13th, 2007
0

Re: option dropdown can't see options

Click to Expand / Collapse  Quote originally posted by digital-ether ...
Must be the style="width:30%".

Remove that and see if it helps...
I suspected that might help, so I made a simple test html file with a select box in it, and that didn't seem to make a difference. But when you suggested it, I went ahead and made the change in the actual code, and voila! It did the trick. Thanks for the help.
Reputation Points: 10
Solved Threads: 0
Posting Whiz in Training
nathanpacker is offline Offline
234 posts
since May 2005
Permalink
Jan 15th, 2007
0

Re: option dropdown can't see options

When you specify a % for the width - it will be the percentage of the parent element.
Your test probably took on the window or document body as the parent..

I've heard IE needs widths and heights specifically defined for alot of CSS to work.

My guess is the parent element does not have a specific width, so the child inherited a percent of 0px or something like that..
Haven't used IE7, so I'm just guessing based on the problems with IE6..
Moderator
Reputation Points: 457
Solved Threads: 101
Nearly a Posting Virtuoso
digital-ether is offline Offline
1,250 posts
since Sep 2005
Permalink
Jan 15th, 2007
0

Re: option dropdown can't see options

Click to Expand / Collapse  Quote originally posted by digital-ether ...
When you specify a % for the width - it will be the percentage of the parent element.
Your test probably took on the window or document body as the parent..

I've heard IE needs widths and heights specifically defined for alot of CSS to work.

My guess is the parent element does not have a specific width, so the child inherited a percent of 0px or something like that..
Haven't used IE7, so I'm just guessing based on the problems with IE6..
You're probably exactly right. Thanks for the help.
Reputation Points: 10
Solved Threads: 0
Posting Whiz in Training
nathanpacker is offline Offline
234 posts
since May 2005

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.
Message:
Previous Thread in PHP Forum Timeline: Writing a config file via form.
Next Thread in PHP Forum Timeline: DD I.D. Verification





About Us | Contact Us | Advertise | Acceptable Use Policy
Forum Index | Build Custom RSS Feed


Follow us on Twitter


© 2011 DaniWeb® LLC