Hi there,

I initially thought I had some problem with my Javascript code for resizing an iFrame, but upon further look it seems that something is wrong with the below page. For some reason my iFrame on this page (www.rjt-online.com/video2.php) won't recognize the height of the content (the content is www.rjt-online.com/video_latest.php).

Could someone tell me why on the video_latest.php page, the iFrame can't detect it's height?

Many thanks!

What made you go for Iframes??? sure ajax or even an includes could have done the trick. Nevertheless. I think your issue lies in #mainvideoiframecontent. Think you have to define a height. Either manually, or javascript.

Hi Macneato,

How would I go about doing the same thing with Ajax or Includes?

I just went for iFrames because they seemed easy.

I need the functionality of the Filter By buttons (where it changes the header text, and the underline of the buttons) to be the same.

Many thanks.

Ok, lets go with Ajax and an includes, since you load different content, depending on which item is clicked. I'm gonna go with Jquery, cause I just prefer it.

Here is a very basic html example

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
        <title>Untitled Document</title>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">
        </script>
        <script>
            $(document).ready(function(){
                $('#filter_menu li').click(function(){
                    var getClickedClass = $(this).attr('id');

	                $.get("process.php", {
	                    query: getClickedClass
	                }, function(data){
	                    $("#resultsContainer").html(data);  
	                });
                });
            });
        </script>
        <style>
            ul#filter_menu li {
                cursor: pointer
            }
        </style>
    </head>
    <body>
        <ul id="filter_menu">
            <li id="nav_latest">
                LATEST
            </li>
            <li id="nav_videos">
                MUSIC VIDEOS
            </li>
            <li id="nav_other_videos">
                OTHER VIDEOS
            </li>
            <li id="nav_all">
                VIEW ALL
            </li>
        </ul>
        <div id="resultsContainer">
        </div>
    </body>
</html>

Followed by the "process PHP"

<?php

	$filter = $_GET['query'];	
	
	if ($filter == 'nav_latest') {
		include ('video_latest.php'); // latest
	} elseif ($filter == 'nav_videos') {
		include ('video_latest.php');// music
	} elseif ($filter == 'nav_other_videos') {
		include ('video_latest.php'); // other
	} elseif ($filter == 'nav_all') {
		include ('video_latest.php'); // all
	} else {
		// Nothing
	}
?>

You will notice, the way i set it up was IDs. If the id equals one of the ids defined in process. We will load the relavant file

Thanks, I'll have a go at that.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.