javascript - bootstrap modal in rails doesn't work properly (not even without turbolinks) -
i have rails app using bootstrap modal ajax. have 2 problems:
even putting //= require jquery.turbolinks (right after req jquery) , //= require turbolinks after //= require bootstarp-sprockets in application.js, js.erb files (new,update,delete) won't executed when click on submit buttons of modals.
without turbolinks works fine (creating, updating, deleting), except 1 thing. if create new task displayed after clicking on modal's submit button ajax, if click right away on edit/delete (delete happens modal well) button of freshly created object, modal doesn't pop up. after page reload, works fine again. it's weird since if edit not new object modal can click again on edit/delete , update/destroy same object. new modal works fine well, if create new object can click on new button again , modal shows up. there issue creating new 1 edit object combination.
have sby encountered same problems?
so current application.js without turbolinks following @ moment:
//= require jquery //= require jquery.turbolinks //= require jquery-ui //= require jquery_ujs //= require chat //= require refile //= require bootstrap-sprockets //= require private_pub //= require_tree .
create.js.erb:
var ready = function () { $("#newtask").modal('hide'); $(".task_name_company").val(''); $(".contentarea").val(''); $(".task_deadline").val(''); //different div class different partials $(".newtaskinsert").prepend('<%= j render @task %>'); $(".newtaskinsert2").prepend('<%= j render partial: "tasks/task_between", locals: { task: @task } %>'); $("#task_<%= @task.id %>").hide().fadein(1000); //26= pagination(12)*every task has 2 tr(2)+ task must hidden(2)=12*2+2 var n = $('tr').length; if (n > 26) { $("tr").slice((-2*(n-26)/2)-1).fadeout(500); }; }; $(document).ready(ready); $(document).on('page:load', ready);
update.js.erb:
var ready = function () { $('#updatetask_<%= @task.id %>').modal('hide'); $('#task_<%= @task.id %>').fadeout(400, function(){ $(this).remove(); $(".newtaskinsert").prepend('<%= j render @task %>'); $(".newtaskinsert2").prepend('<%= j render partial: "tasks/task_between", locals: { task: @task } %>'); }); }; $(document).ready(ready); $(document).on('page:load', ready);
Comments
Post a Comment