1

Possible Duplicate:
Resizing an iframe based on content

What I am trying to do is:

Use a div to post a form to as an alternative to using ajax as there are some things that I need that are not working with ajax. My code is below for the 2 pages I am using:

The page with the form:

<form action="iframe.php" method="post" onsubmit="document.getElementById(\"\")" target="my_iframe">
    <input type="hidden" name="post" value="postdata" />
  <input type="submit" value="Do Stuff!" />
</form>
<!-- when the form is submitted, the server response will appear in this iframe -->
<iframe frameborder="0" name="my_iframe" id="frame" src="iframe.php"></iframe>

The iframe source:

<?php
    if(isset($_POST['post'])){
        var_dump($_POST);
    }
?>

What can I do about this? Thanks in advance!

Community
  • 1
  • 1
user115422
  • 4,172
  • 8
  • 22
  • 36

2 Answers2

1

MuqMan good to see you again! You can change the size of an iframe using its properties. You can then use JavaScript or PHP, depending on what or how you are determining the auto resize, to give a dynamic number to them. The attributes you're looking for:

<iframe height="200" width="200"></iframe>

iframe properties http://www.w3schools.com/tags/tag_iframe.asp

If you're wanting to show an iframe after the click, you will want to use a change source event of the iframe.

Here's a starter for you iFrame src change event detection?

Community
  • 1
  • 1
Jared Drake
  • 972
  • 4
  • 12
  • umm... how? I have never done such but I love your suggestion! And yes, great to see you again! Please +1 my question if it is good as I heard people with low rep can get knocked off :D – user115422 Aug 20 '12 at 02:45
  • 1
    What we really need to know is how and why you want to resize an iframe? The how is a question of how do you know if it needs resized. – Jared Drake Aug 20 '12 at 02:47
  • Thanks for the +1, I gave u one to. OK: so I need to resize the iframe so that it doesnt take up un nesseccary space i.e. before the form is submitted I want it to take up NO space and when it is then I want it to take up only as much is required - my theme is very constricting and also is it possible to make the iframe transeparent so it blends with the background? – user115422 Aug 20 '12 at 02:49
  • 1
    Ok, we'll I don't think we're talking about resize in the same way. I'm thinking you probably want to use the jQuery show function here. – Jared Drake Aug 20 '12 at 02:52
  • can you pastebin me the code? I have next to no experience with jquery... with the jquery library as im not too sure about that... – user115422 Aug 20 '12 at 02:53
1

Start with your iframe being hidden in CSS with:

#frame {display:none}
.visible {display:block}

Then something like this on the submit button:

onclick="$(#frame).addClass('visible');"

This will work regardless of what the form does, though, so if you have validation, the frame will still become visible each time the button is clicked. If you rather, you can toggle it on and off with each press, like this:

onclick="$(#frame).toggleClass('visible');"
zenkaty
  • 1,528
  • 9
  • 11
  • this works but doesnt auto resize... thats a key thing – user115422 Aug 20 '12 at 06:00
  • oh, the contents of the frame are a different height each time? so you want the frame to be the height of the contents, regardless of how high they are? – zenkaty Aug 21 '12 at 03:49
  • Correct! That's what I need to know. – user115422 Aug 22 '12 at 02:03
  • 1
    ok, there are a few different solutions for that outlined here: http://stackoverflow.com/questions/819416/adjust-width-height-of-iframe-to-fit-with-content-in-it – zenkaty Aug 22 '12 at 03:20
  • I believe I tried that but it didn't work with my browser (im using Safari 6 on MAC OS X .8) – user115422 Aug 22 '12 at 03:21
  • You tried all those different solutions? There are quite a few topics on stackoverflow about this - I notice your question has been closed as a duplicate too, linking to another one. You should be able to find a solution by looking through those threads. If you try one, and have a more specific issue, you can post a new question, with the code you're using, and we can pick it apart then :) – zenkaty Aug 22 '12 at 03:28