{"action":"created","issue":{"url":"https://api.github.com/repos/kevinchappell/formBuilder/issues/22","labels_url":"https://api.github.com/repos/kevinchappell/formBuilder/issues/22/labels{/name}","comments_url":"https://api.github.com/repos/kevinchappell/formBuilder/issues/22/comments","events_url":"https://api.github.com/repos/kevinchappell/formBuilder/issues/22/events","html_url":"https://github.com/kevinchappell/formBuilder/issues/22","id":117340479,"number":22,"title":"Uncaught TypeError: $(...).formBuilder is not a function","user":{"login":"snehalsabale","id":15107269,"avatar_url":"https://avatars.githubusercontent.com/u/15107269?v=3","gravatar_id":"","url":"https://api.github.com/users/snehalsabale","html_url":"https://github.com/snehalsabale","followers_url":"https://api.github.com/users/snehalsabale/followers","following_url":"https://api.github.com/users/snehalsabale/following{/other_user}","gists_url":"https://api.github.com/users/snehalsabale/gists{/gist_id}","starred_url":"https://api.github.com/users/snehalsabale/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/snehalsabale/subscriptions","organizations_url":"https://api.github.com/users/snehalsabale/orgs","repos_url":"https://api.github.com/users/snehalsabale/repos","events_url":"https://api.github.com/users/snehalsabale/events{/privacy}","received_events_url":"https://api.github.com/users/snehalsabale/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":1,"created_at":"2015-11-17T12:01:48Z","updated_at":"2015-11-17T12:32:55Z","closed_at":null,"body":"I am integrating this plug in rails application.\r\nIn HTML page i used the code given at http://kevinchappell.github.io/formBuilder/ . But it always give an error for fromBuilder.\r\nI think the sequence of requiring the javascript files is somehow wrong.\r\n\r\nThe code in application.js is:\r\n\r\n//= require jquery\r\n//= require form-builder\r\n//= require jqueryui-1.10.3.min\r\n//= require jquery_ujs\r\n//= require jquery.turbolinks\r\n//= require bootstrap-sprockets\r\n//= require jquery.dataTables.min\r\n//= require dataTables.bootstrap\r\n//= require jquery.validate\r\n//= require jquery.validate.additional-methods\r\n//= require_tree .\r\n\r\n\r\n\r\nAnd \r\nhere is my HAML file code:\r\n\r\n%link{:href => \"https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.css\", :media => \"screen\", :rel => \"stylesheet\", :type => \"text/css\"}\r\n.demo-wrap\r\n  / MAIN CONTENT\r\n  #main_content_wrap.outer\r\n    %section#main_content.inner\r\n      .build-form\r\n        %h2\r\n          %strong Build The Form\r\n        %form{:action => \"\"}\r\n          %textarea#form-builder-template{:cols => \"30\", :name => \"form-builder-template\", :rows => \"10\"}\r\n        %br{:style => \"clear:both\"}\r\n      .render-form\r\n        %h2\r\n          %strong Render The Form\r\n        %form#rendered-form\r\n          %p.cta Add some fields to the formBuilder above and render them here.\r\n        .render-description\r\n          %h3 Try it out\r\n          %button#render-form-button.btn.btn-primary Render form\r\n      %br{:style => \"clear:both\"}\r\n-#%script{:src => \"https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js\"}\r\n-#%script{:src => \"https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js\"}\r\n\r\n:javascript\r\n  jQuery(document).ready(function($) {\r\n    'use strict';\r\n    var template = document.getElementById('form-builder-template'),\r\n      formContainer = document.getElementById('rendered-form'),\r\n      renderBtn = document.getElementById('render-form-button');\r\n    console.log(template)\r\n    $(template).formBuilder();\r\n    $(renderBtn).click(function() {\r\n      $(template).formRender({\r\n        container: $(formContainer)\r\n      });\r\n    });\r\n  });\r\n:javascript\r\n  (function(i, s, o, g, r, a, m) {\r\n    i['GoogleAnalyticsObject'] = r;\r\n    i[r] = i[r] || function() {\r\n      (i[r].q = i[r].q || []).push(arguments)\r\n    }, i[r].l = 1 * new Date();\r\n    a = s.createElement(o),\r\n      m = s.getElementsByTagName(o)[0];\r\n    a.async = 1;\r\n    a.src = g;\r\n    m.parentNode.insertBefore(a, m)\r\n  })(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');\r\n\r\n  ga('create', 'UA-4784386-21', 'auto');\r\n  ga('send', 'pageview');\r\n\r\nHow do i fix this ?"},"comment":{"url":"https://api.github.com/repos/kevinchappell/formBuilder/issues/comments/157358872","html_url":"https://github.com/kevinchappell/formBuilder/issues/22#issuecomment-157358872","issue_url":"https://api.github.com/repos/kevinchappell/formBuilder/issues/22","id":157358872,"user":{"login":"kevinchappell","id":1457540,"avatar_url":"https://avatars.githubusercontent.com/u/1457540?v=3","gravatar_id":"","url":"https://api.github.com/users/kevinchappell","html_url":"https://github.com/kevinchappell","followers_url":"https://api.github.com/users/kevinchappell/followers","following_url":"https://api.github.com/users/kevinchappell/following{/other_user}","gists_url":"https://api.github.com/users/kevinchappell/gists{/gist_id}","starred_url":"https://api.github.com/users/kevinchappell/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/kevinchappell/subscriptions","organizations_url":"https://api.github.com/users/kevinchappell/orgs","repos_url":"https://api.github.com/users/kevinchappell/repos","events_url":"https://api.github.com/users/kevinchappell/events{/privacy}","received_events_url":"https://api.github.com/users/kevinchappell/received_events","type":"User","site_admin":false},"created_at":"2015-11-17T12:32:55Z","updated_at":"2015-11-17T12:32:55Z","body":"Does your Gem file have jquery and jquery ui? Gem file should have \r\n```\r\ngem 'jquery'\r\ngem 'jquery-ui-rails'\r\n```\r\n\r\nand in application.js `form-builder` should be after the jquery libraries\r\n```\r\n//= require jquery\r\n//= require jquery_ujs\r\n//= require jquery-ui\r\n//= require jquery-ui/sortable\r\n//= require form-builder\r\n```\r\n\r\nAlso be sure form-builder.js is in `vendor/assets/javascripts/`\r\n\r\nQuick notes: You won't need to manually add jquery and jquery ui scripts in your HAML and the google tracking is actually for the formBuilder github pages. You'll want to change to your own Google Analytics id.\r\n\r\nIs the project on github? If so I could take a look."}}