Vfrdtyky

I'm currently developing a simple star rating system using jquery on Rails 5. It is working perfectly in development but not production.

However, when I include config.assets.debug = true in /config/production.rb, then it is working. One of the reason that I suspect why it behaves this way is because the precompile application.js somehow had made the jQuery (document).on not working. I had been stucked with this for a few days now, and not be able to find any solution online.

Just wondering, is it possible that there are conflict in the application.js? Is there a need for me to jQuery.noConflict() function?

Appreciate you help on this. Below is all the related code for reference.

application.js

//= require jquery

//= require jquery_ujs

//= require bootstrap/js/bootstrap.bundle

//= require activestorage

//= require Chart.bundle

//= require chartkick

//= require turbolinks

//= require turbolinks-compatibility



// Start for AGENCY

//= require js_agency/jqBootstrapValidation

//= require js_agency/contact_me

//= require js_agency/agency.min

// End for AGENCY



//START FOR ADMIN

//= require jquery_sb-admin/jquery

//= require jquery-easing_sb-admin/jquery.easing

//= require chart.js/Chart.min

//= require datatables/jquery.dataTables

//= require datatables/dataTables.bootstrap4

//= require js_sb-admin/sb-admin.min

//= require js_sb-admin/demo/datatables-demo

//= require js_sb-admin/demo/chart-area-demo

//END FOR ADMIN

//= require_self

//= require_tree .





$(document).on('turbolinks:load',function(){

    $('.rating-star').click(function(){

        var star = $(this);

        var data_form = $(this).attr('data-form');

        var data_field = $(this).attr('data-field');

        var stars = $(this).attr('data-stars');



        for (i=1;i<=5;i++){

            if(i <= stars){

                $('#' + 'rating' + '_' + data_form + '_' + i).removeClass('glyphicon glyphicon-star-empty');

                $('#' + 'rating' + '_' + data_form + '_' + i).addClass('glyphicon glyphicon-star');

            } else {

                $('#' + 'rating' + '_' + data_form + '_' + i).removeClass('glyphicon glyphicon-star');

                $('#' + 'rating' + '_' + data_form + '_' + i).addClass('glyphicon glyphicon-star-empty');

            }

        }

        $('#' + data_field).val(stars);

        $('#' + 'feedback').val(stars);

    });

});

/views/star/star_rating.html.erb

<div class="col-md-12">

  <% data_form = "Taska_try" %>

  <% data_field = "taska_rating" %> <!--the field for the stars -->

    <% (1..5).each do |i| %>

      <h1 id="rating_<%= data_form %>_<%= i %>" 

          data-form="<%= data_form %>" 

          data-stars="<%= i %>" 

          data-field="<%= data_field %>"

          class="rating-star glyphicon glyphicon-star-empty">

      </h1>

    <% end %>    

</div>



<div class="col-md-12">

  <% data_form = "Classroom_try" %>

  <% data_field = "classroom_rating" %> <!--the field for the stars -->

    <% (1..5).each do |i| %>

      <h1 id="rating_<%= data_form %>_<%= i %>" 

          data-form="<%= data_form %>" 

          data-stars="<%= i %>" 

          data-field="<%= data_field %>"

          class="rating-star glyphicon glyphicon-star-empty">

      </h1>

    <% end %>

</div>

I don't see anywhere you're triggering custom event turbolinks:load. So, I guess you need just:

$(document).on('load'

Instead of:

$(document).on('turbolinks:load'

Or, if you wish you can trigger the custom event somewhere:

var turbolinks = jQuery.Event('turbolinks:load');

$(document).trigger(turbolinks);

Or simply trigger like:

$(document).trigger('turbolinks:load');

I don´t know the reason but the solution is simple

Just clone the jquery function before load any script in the project and then use it when you need it.

$(document).ready(function() {



    myDocOn = $(document).on();



      myDocOn.on("mousemove",

            function() {

                // refeshMyTime();



            }

        )



    )};

No matter what happen whit the original function in any mdoification by another script, your function will be save.

This code works for me.

¿Why i have a negative point?

I can't answer anymore just by this =( please help me.