2

I am making a search engine and I have a few issues with my iframe. When a user clicks enter, an iframe is created. I want the iFrame to get as much height as it needs so it blends in with the rest of the page. Here is my code:

<input type="search" id="q" name="q"/>
<input type="submit" value="Search" onclick="submit(); return false;"/>

<script>
function submit() {
        page.innerHTML = '<iframe id="results" src="" frameborder="0" scrolling="no" style="overflow:hidden; overflow-x:hidden; overflow-y:hidden; height:150%; width:99%; position:absolute;" height="150%" width="99%" onload=""/>';
        document.getElementById('results').src = 'search.php?q=' + query + '&session=<?=$custom_session;?>&no-cache=' + Math.random();
}
</script>

This is a cut down version of the script. The actual page is located at - http://v1k.me/search/alpha/ If you look at the HTML, you will be able to see the whole code.

If you search "mobile", the results will be cut off at 9th result (https://i.stack.imgur.com/yphai.png), however if you search say "mail", it will display everything and will stop halfway of the page list.

user3000283
  • 23
  • 3
  • You can find your answer on this question : http://stackoverflow.com/questions/13146793/iframe-reaches-bottom-of-page – iizno Nov 16 '13 at 20:56
  • Where is the problem? The example page you regarded does not show any problem. – SaidbakR Nov 16 '13 at 20:59
  • Is there any reason you are using an iframe for this? Why not output the search results directly to the document rather than using an iframe of search.php? – tw16 Nov 16 '13 at 21:11
  • Because I don't want the page to refresh and there are several pages. – user3000283 Nov 16 '13 at 23:15

1 Answers1

0

Try this:

<iframe id="results" src="" onload="autosize('results')"></iframe>

<script>
function autosize(ifrId){
  var ifr = document.getElementById(ifrId);
  var doc = ifr.contentDocument ? ifr.contentDocument : ifr.contentWindow.document;
  var obj = ifr.style ? ifr.style : ifr;
  obj.height = doc.body.scrollHeight + "px";
} 
</script>
lukpaw
  • 1,603
  • 2
  • 26
  • 31