js/jquery/iframe-post-form.js

   1 /**
   2  * jQuery plugin for posting form including file inputs.
   3  *
   4  * Copyright (c) 2010 - 2011 Ewen Elder
   5  *
   6  * Licensed under the MIT and GPL licenses:
   7  * http://www.opensource.org/licenses/mit-license.php
   8  * http://www.gnu.org/licenses/gpl.html
   9  *
  10  * @author: Ewen Elder <ewen at jainaewen dot com> <glomainn at yahoo dot co dot uk>
  11  * @version: 1.1.1 (2011-07-29)
  12 **/
  13 (function ($)
  14 {
  15
  16
  17     $('input[type=\"file\"]').each(function(i, it) {
  18         $(it).closest('form').attr('enctype', 'multipart/form-data').attr('encoding', 'multipart/form-data');
  19     });
  20
  21         $.fn.iframePostForm = function (options)
  22         {
  23                 var response,
  24                         returnReponse,
  25                         element,
  26                         status = true,
  27                         iframe;
  28
  29                 options = $.extend({}, $.fn.iframePostForm.defaults, options);
  30
  31
  32                 // Add the iframe.
  33                 if (!$('#' + options.iframeID).length)
  34                 {
  35                         $('body').append('<iframe id="' + options.iframeID + '" name="' + options.iframeID + '" style="display:none" />');
  36                 }
  37
  38
  39                 return $(this).each(function ()
  40                 {
  41                         element = $(this);
  42
  43
  44                         // Target the iframe.
  45                         element.attr('target', options.iframeID);
  46
  47
  48                         // Submit listener.
  49                         element.submit(function ()
  50                         {
  51                                 // If status is false then abort.
  52                                 status = options.post.apply(this);
  53
  54                                 if (status === false)
  55                                 {
  56                                         return status;
  57                                 }
  58
  59
  60                                 iframe = $('#' + options.iframeID).load(function ()
  61                                 {
  62                                         response = iframe.contents().find('body');
  63
  64
  65                                         if (options.json)
  66                                         {
  67                                                 returnReponse = $.parseJSON(response.html());
  68                                         }
  69
  70                                         else
  71                                         {
  72                                                 returnReponse = response.html();
  73                                         }
  74
  75
  76                                         options.complete.apply(this, [returnReponse]);
  77
  78                                         iframe.unbind('load');
  79
  80
  81                                         setTimeout(function ()
  82                                         {
  83                                                 response.html('');
  84                                         }, 1);
  85                                 });
  86                         });
  87                 });
  88         };
  89
  90
  91         $.fn.iframePostForm.defaults =
  92         {
  93                 iframeID : 'iframe-post-form',       // Iframe ID.
  94                 json : false,                        // Parse server response as a json object.
  95                 post : function () {},               // Form onsubmit.
  96                 complete : function (response) {}    // After response from the server has been received.
  97         };
  98 })(jQuery);