Object [object Object] has no method 'nestedFields' - awesome_nested_fields gem - Rails 3.2 jquery-ui-1.9.2

1
votes

I have installed this pretty looking gem and have spent the last 2 hours trying to make it work.

I manage to display nested fields within the parent form and create/update records.

However, the add/remove JS links do not work. And this is because in the console is giving me this error.

Uncaught TypeError: Object [object Object] has no method 'nestedFields' neste_attributes_forms.js:2
(anonymous function) neste_attributes_forms.    js:2
fire                                            jquery.js:1018
self.fireWith                                   jquery.js:1128
jQuery.extend.ready                             jquery.js:417
DOMContentLoaded

I am pretty new in JS. So, I am not sure what the problem is.

I have tried the same code it says on the gem page:

$(document).ready(function(e) {
  $('FORM').nestedFields();
});

I have also tried calling by the id of the div. But, to not avail. I have check the page source and it loads this piece of code.

Do you have any idea what I am missing? any help much appreciated!!!

The piece of the form: haml

= form_for(@event) do |f|
  ....somefields....

  #nested_layers   
    .items
      = f.nested_fields_for :details do |f|
        %fieldset.item
          = f.label :town
          = f.text_field :town
          %a.remove{:href => "#"} remove
          = f.hidden_field :id
          = f.hidden_field :_destroy
    %a.add{:href => "#"} add phone
  ..someOtherFields....

application.js

//= require jquery
//= require jquery_ujs
//= require jquery-ui-1.9.2.custom.min
//= require jquery.nested-fields
....

FIXED: Application.js contains a really clever sentence that one should not delete: // WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD // GO AFTER THE REQUIRES BELOW. So just make sure every //= require... is right below another. Otherwise you will miss methods!!

1
javascriptruby-on-railsruby-on-rails-3.2nested-formsnested-attributes
you have to add //= require jquery.nested-fields to app/assets/javascripts/application.js – ted
I'd swear it is added. I can see it when inspecting the source. – Sergio Nekora
is that line the last that is included? You should the lib being included in <head> when you open a page in browser – ted
Not sure what you mean. But that line is not the last. Those are the first of the file. After that there is more, the that calls .nestedFields() aswell. Having a look at the source, it all loads inside the <head> tag. – Sergio Nekora
Well... I am about to commit suicide!!! I just read // WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD // GO AFTER THE REQUIRES BELOW. My visual organization made it not to work! – Sergio Nekora

1 Answers

0
votes

Seems like the needed javascript lib is not loaded so make sure that:

//= require jquery.nested-fields

is properly included in app/assets/javascripts/application.js