Question

I’m having problems with callbacks not triggering when I’m using iFrame with a Rails form. What I have done is to create the iFrame with the form dynamically:

$('#mapMain').append('<iframe id="saveAreaForm"  />');
$('#saveAreaForm').attr('src', "areas/new");

This is the form code:

= simple_form_for(@area, :remote => true, :html => {  :id => 'create_area_form' }) do |f|

  .field
    = f.label :name
    %br
    = f.text_field :name
  -#.field
  -#  %br
  -#  = f.association :area_group

  .field
    = f.text_field :pointsTxt
    %br
  .actions
    = f.submit
    = link_to 'Cancel', '#', {:id => 'cancel_save'}

I then add a callback function to listen to actions (it’s running without errors), and I have tried different number of function parameters:

 $('#saveAreaForm').contents().find('#create_area_form').load(function () {
            $('#saveAreaForm').contents().find('#create_area_form').bind('ajax:success', function(e, data, status, xhr) {
                alert("success!");
            }).
            live('ajax:loading', function() {
                alert("loading!");
            }).live
            ('ajax:complete', function(dr) {
                alert("complete!");
            }).live
            ('ajax:error', function() {
                alert("error!");
            });
        });

I then enter in the form and press submit. None of the events above are triggered but the controller action is called (I have used both bind and live) and in FireBug I’m getting a response:

I’m using a callback in another place (for a link but not form submission) and that is working fine.

The only thing I can think of causing this is that iFrame is not returning callbacks because when I assign the callbacks above I have reference to the id’s I’m using.

Answer 1

Chances are the iframe isn’t loaded yet. Have you considered having the callbacks setup in the iframe and call the parent from within?