Rails asset pipline and Jquery plugins issue -


i using rails jquery gem.

i have following in application.js

//= require jquery //= require jquery_ujs //= require_tree . 

do these declarations include files in order ?

i using jquery pluging textareaexpander (http://www.sitepoint.com/blogs/2009/07/29/build-auto-expanding-textarea-1/)

i getting js error

jquery("textarea[class*=expand]").textareaexpander(); 

on last line of plugin below

// initialize expanding textareas jquery(document).ready(function() {   jquery("textarea[class*=expand]").textareaexpander(); }) 

i don't ? because jquery hasn't been loaded. why textareaexpander still not defined ?

for reference below rest of code in plugin file.

(function($) { // jquery plugin definition $.fn.textareaexpander = function(minheight, maxheight) { var hcheck = !($.browser.msie || $.browser.opera); // resize textarea function resizetextarea(e) { // event or initialize element? e = e.target || e; // find content length , box width var vlen = e.value.length, ewidth = e.offsetwidth; if (vlen != e.vallength || ewidth != e.boxwidth) { if (hcheck && (vlen < e.vallength || ewidth != e.boxwidth)) e.style.height = "0px"; var h = math.max(e.expandmin, math.min(e.scrollheight, e.expandmax)); e.style.overflow = (e.scrollheight > h ? "auto" : "hidden"); e.style.height = h + "px"; e.vallength = vlen; e.boxwidth = ewidth; } return true; }; // initialize this.each(function() { // textarea? if (this.nodename.tolowercase() != "textarea") return; // set height restrictions var p = this.classname.match(/expand(\d+)\-*(\d+)*/i); this.expandmin = minheight || (p ? parseint('0'+p[1], 10) : 0); this.expandmax = maxheight || (p ? parseint('0'+p[2], 10) : 99999); // initial resize resizetextarea(this); // 0 vertical padding , add events if (!this.initialized) { this.initialized = true; $(this).css("padding-top", 0).css("padding-bottom", 0); $(this).bind("keyup", resizetextarea).bind("focus", resizetextarea); } }); return this; }; })(jquery);   // initialize expanding textareas jquery(document).ready(function() { jquery("textarea[class*=expand]").textareaexpander(); });  

as can see function textareaexpander first defined extending jquery , called on document ready still not working. have similar issues other plugins on of them chosen.js.

if 1 can point out issue , elaborate causing this, because me doesn't make sense ( missing point here).

relevant code

development.rb  config.assets.compress = false config.assets.debug = true  application.rb config.assets.enabled = true config.assets.version = '1.0 

ok did experiment suggested check if syntax issue, turns out isn't.

i did experiment, if remove line

//= require_tree . 

from application.js , instead replace with

//= require_self 

and in view file (the view being rendered) add following @ end

= javascript_include_tag 'libs/jquery.textarea-exapander' 

all seems work perfectly. ideas ?

more info

app/assets/javascript   |- application.js   |- chosen.jquery.js   |- admin/      |- categories.js.coffee   |- libs/      |- jquery.textarea-exapander.js      |- modernizr.js      |- platformselector.js      |- waypoints.js   |- gmaps4ails/      |- gmaps4rails.base.js      |- gmaps4rails.bing.js      |- gmaps4rails.googlemaps.js 

my application.js

//= require jquery //= require jquery_ujs //= require_tree . 

code layout

%html   %head     %title whatever     %link{type:"text/css",rel:"stylesheet", href:"http://fonts.googleapis.com/css?family=abel"}     = stylesheet_link_tag    "application", :media => "all"     = stylesheet_link_tag 'gmaps4rails'     = javascript_include_tag "application"     = csrf_meta_tags   %body     = render 'shared/header'     %div#main.inside.topadd       = yield       %div.wrapper     =render 'shared/footer'     = yield :scripts 

the above setup not work

the following setup works

my application.js

//= require jquery //= require jquery_ujs 

inside registrations/new.html.haml

some bla bla bla bla haml code  = javascript_include_tag 'libs/jquery.textarea-exapander' 

this works, same true other plugin chosen.js if include in after view works otherwise gives same error .chosen not function.

so comments looks wrong local setup

i have noticed strange thing in html on heroku , local

this body class on heroku

linux js gecko gecko_20100101 firefox firefox_12_0 firefox_12 gecko_12_0 

but on local body class

js no-flexbox canvas canvastext webgl no-touch geolocation postmessage no-websqldatabase indexeddb hashchange history draganddrop websockets rgba hsla multiplebgs backgroundsize borderimage borderradius boxshadow textshadow opacity cssanimations csscolumns cssgradients no-cssreflections csstransforms csstransforms3d csstransitions fontface generatedcontent video audio localstorage sessionstorage webworkers applicationcache svg inlinesvg smil svgclippaths linux gecko gecko_20100101 firefox firefox_12_0 firefox_12 gecko_12_0 js flexbox canvas canvastext webgl no-touch geolocation postmessage no-websqldatabase indexeddb hashchange history draganddrop websockets rgba hsla multiplebgs backgroundsize borderimage borderradius boxshadow textshadow opacity cssanimations csscolumns cssgradients no-cssreflections csstransforms csstransforms3d csstransitions fontface video audio localstorage sessionstorage webworkers applicationcache svg inlinesvg smil svgclippaths 

i seeing every rails app locally

<div id="cboxoverlay" style="display: none;"></div> <div id="colorbox" class="" style="padding-bottom: 0px; padding-right: 0px; display: none;"></div> 

after body starts ,

<div id="supersized-loader"></div> <div id="supersized"></div> 

before body ends not using neither including color box far...

what going on ??

thanks

figured out after hours. issue not of looking it.

i had nginx running on local machine, conf of pointing project of mine , public directory set project, path /assets/application.js being served nginx directly public/assets/ directory of other project. , since other project on heroku used precompile assets locallay compiled application js created inside app/assets being served.

thanks lot guys, comments , discussion helped me figure out issue local machine , bad going on configuration.

thanks again


Comments

Popular posts from this blog

java - Play! framework 2.0: How to display multiple image? -

gmail - Is there any documentation for read-only access to the Google Contacts API? -

php - Controller/JToolBar not working in Joomla 2.5 -