javascript - How to enable `sorttable.js` on Rails4 with turbolinks -


  • rails 4.2.0, turbolinks (2.5.3)
  • jquery-rails (4.0.3), jquery-ui-rails (5.0.3)
  • sorttable.js
  • app used on chrome, firefox, , ie

what should happen: whether redirect, render, or clicking new page in app, table class sorttable (i edited in original js) should sortable column heading.

what happens: on contacts page. hit refresh, , logger statements in js appear. plugin works expected. if navigate home, contacts, file still listed in page source, no logger statements appear. plugin not work.

our application.js reads such:

//= require jquery //= require jquery_ujs //= require jquery-ui //= require jquery_nested_form //= require bootstrap //= require sorttable //= require_directory . //= require autocomplete-rails //= require turbolinks //= require bootstrap-switch

disabling turbolinks per-page or altogether not solution us. open using gems if file not work turbolinks; however, gem should add little code app. we'd rather not have classes dedicated choosing column sort. also, columns to-be-sorted not activerecord (like 2 attributes in 1 cell).

after debugging, figured out why turbolinks not sorttable.js. js file includes triggers (some based on browser type) initiate sorttable on document load. such event listener incompatible turbolinks. have done make work following.

  1. move vendor/assets/javascripts/sorttable.js app/views/shared/js/_sorttable.html.haml

  2. prefix new file :javascript (%script{languauge: "javascript"}), , indent following lines 2 spaces

  3. remove sorttable application.js

  4. at top of related pages, add following code block:

    = render 'shared/js/sorttable' %script   $(document).on("page:change", sorttable.init)

for code examples , further explanation, please see this gist.


Comments

Post a Comment

Popular posts from this blog

Email notification in google apps script -

https://support.google.com/docs/answer/91588?hl=en i have sheet the cells filled in data pulled via apps script, website. pull in exact same data, not. on old sheets version use able emails when data "changes" different value. new sheets, email when new data pasted cells, though exact same data......and, can't set @ ranges anymore, entire document. there easy way watch cells when data changes, , email myself? this looks lot you're trying do. for checking whether value has changed after edit, this gives necessary information it. hence, know whether new value same 1 or not. implementing "workaround" talked in second link, able compare , send email myself if value changed. initiate onedit trigger goes off onedit function uses these lines after checks in place have passed. var email = "xyz@whatever.com"; mailapp.sendemail(email, "triggermail", "a change has occurred in sheet"); note: sends "notification...
Read more

c++ - Difference between pre and post decrement in recursive function argument -

i have following sample code used pre-decrement void function(int c) { if(c == 0) { return; } else { cout << "dp" << c << endl; function(--c); cout << c << endl; return; } } this function give output input 4 : dp3 dp2 dp1 dp0 0 1 2 3 but when use post decrement void function(int c) { if(c == 0) { return; } else { cout << "dp" << c << endl; function(c--); cout << c << endl; return; } } output goes in infinite loop dp4 can explain me in detail why happens ? this happens because function(c--) called same value of c , when finishes c decremented. recursively called, hence called same value no chance of return , hit stack overflow error. assume this, int x = 1, y = 0; y = x++ result y == 1 , x == 2. if y = ++x , bot x , y 2.
Read more

javascript - IE11 incompatibility with jQuery's 'readonly'? -

the code i'm running has no issues in firefox, or chrome. user typing 1 textbox, tabs next , can continue typing that. when run webpage on ie11, user tabs next textbox , can't type in. textbox has double-clicked before user can insert anything. i've googled , seems ie give problems when using older jquery (i.e. prefers 'prop' 'attr' ). in code below jquery's readonly keyword being used in way ie11 no longer recognise/accept? i assume issue readonly , removeclass('ignore') working expected. //when focus on textbox 1 $("#field1").focus(function() { //remove readonly property textbox 1 $('#field1').prop('readonly', false).removeclass('ignore'); //add readonly property other textboxes $('#field2, #field3, #field4') .prop('readonly', 'readonly').addclass('ignore').val(''); }); i'm using jquery 2.1.3 ...
Read more