Menu

what the hell are iframes?

2008-01-15
2013-04-22
  • Howard Miller

    Howard Miller - 2008-01-15

    Well, I know what an iframe is but what does "submitting via an iframe" in  pieforms actually *do*. I see you use it in Mahara all the time, but I can't figure out what it is actually doing and why it might be a good thing.

    Thanks :-)

     
    • Nigel McNie

      Nigel McNie - 2008-01-15

      Okay, firstly an iframe is an HTML tag: <iframe>. Its purpose is to allow you to embed HTML documents inside other ones, just like frames, except you can do it 'inline', as it were - no frameset DTD required, they can be anywhere etc.

      If you enable Pieforms' 'jsform' support for a form, then it uses an iframe for form submission. This means that instead of the form data being posted as normal and the page reloading, the following happens:

      1) When the form is submitted, Pieforms puts an iframe at the bottom of the form. It is hidden using CSS (you can verify all of this using Firebug by the way).
      2) Pieforms changes the target of the form from being the default, which is the current document, to being the iframe instead.
      3) Pieforms adds a function to the 'window' javascript object, that will handle the result of the form submission. You can see this in firebug as 'window.pieformHandler_[form-name]'.
      4) Pieforms lets the form submission continue as normal by the browser. Only now, the target of the form is the hidden iframe, so the browser loads the return result in the iframe.
      5) On the server side, pieforms works out that the form has been submitted by javascript, and replies with JSON, either to say the form submitted OK or to list all the errors that occured.
      6) The reply loads in the hidden iframe. The reply includes a call to 'parent.pieformHandler_[form-name]', which calls the function pieforms previously registered to handle the result.
      7) The function uses the result as necessary - inserting error messages into the form or calling the user defined javascript success callback, or whatever.

      You can see all of this in firebug. You could find the code in pieform.php that generats the iframe (it's in the private method 'submit_js'), and make it not hidden, so you could see the iframe at work.

      Anyhoo, that's the what. The why is so that we only send and receive as much data as is necessary. There's no need to reload the page to submit the form. It's faster!

      There are disadvantages to using these forms sometimes, namely if other parts of the page need to be updated as well, but they're easy enough to deal with in javascript using the javascript success callback.

      Also, currently they don't work too well if the user has disabled javascript in their browser. However, this is fixed in Pieforms 0.3.0, which is currently in SVN trunk, and will be out quite soon (cos I need it for Mahara 1.0 :).

       
    • Howard Miller

      Howard Miller - 2008-01-15

      Thanks for the comprehensive reply. I think I'm being a bit stupid, because it sounds like a lot of complication for little actual benefit. Surely unless the page is massively complicated, reloading the page is not a significant overhead? Graphics etc. will/should have been cached.

       
      • Nigel McNie

        Nigel McNie - 2008-01-15

        You're able to do a lot if you can execute javascript while a form is being submitted. One example would be a file upload progress bar, if your form includes uploading a file. Once the form is submitted, you can do all sorts of fancy things with the page structure. There's not too many examples in Mahara, but plenty of "web 2.0" websites have examples of cool things done. Think of gmail - check a few messages and archive them, and they disappear quickly - much quicker than a full reload of the page.

         
        • Howard Miller

          Howard Miller - 2008-01-15

          Ok, I see now thanks :-)

          I know enough to know I don't have to worry about it. It's a poor excuse but I don't know Javascript at all and I'm interested in the 'quick' aspect of pieforms not the 'fancy'!! The quick aspect is as advertised by the way. Puts the Pear alternative to shame.

           
          • Nigel McNie

            Nigel McNie - 2008-01-15

            Lol, mind if I use that last part as a testimony? :D

             
            • Howard Miller

              Howard Miller - 2008-01-16

              Be my guest!!

              Actually, having slept on it I'm beggining to see why this is cool, especially if there is complex verification I guess. However, the mechanism goes totally over my head :-( I need to take a step (or two) back and do some reading. For example, I have no clue what problem using a hidden iframe is fixing - why not interact directly with the original form?

              Don't answer that :-) Google will know!!

               
    • John Mendes

      John Mendes - 2008-09-24

      Dear,

      I have a web application that works with javascript and for their integration with others web applications need be used by iframe.

      I had read the documentation about what pieform's elements has been accepting and iframe not is one, then, my question is: how can I create an iframe using pieforms? There are in other version?

      I have been developing for mahara latest version. Could you help me with iframe?

      Thanks a lot and congratulation about your work with pieform, excellent project in my opinion.

      John Mendes

       

Log in to post a comment.

MongoDB Logo MongoDB