रेल 5 + JQuery प्रगति पट्टी

Question

काम नहीं कर रहा है JQuery प्रगति पट्टी को कार्यान्वित करना ताकि जब आप को स्क्रॉल करते हैं तो इसे शीर्ष पर एक हरा बार दिखाना चाहिए। जब मैं प्रगति पट्टी स्क्रॉल करना शुरू करता हूं तो प्रकट नहीं होता है। मैं देख रहा हूँ स्क्रीनशॉट

scroll.js

$(document).on('scroll', function() { 

    var pixelsFromTop = $(document).scrollTop() 

    var documentHeight = $(document).height() 
    var windowHeight = $(window).height() 

    var difference = documentHeight - windowHeight 

    var percentage = 100 * pixelsFromTop/difference 

    $('.bar').css('width', percentage + '%') 

}) 

show.html.erb

<div class="progress"> 
    <div class="bar"></div> 
</div> 

<section class="day"> 

    <h2><%= "To make #{number_to_currency @product.revenue}" %></h2> 
    <p class="lead"><%= "You need to make #{number_to_currency @product.monthly_amount} a month" %><br/> 
    <%= "You need to make #{number_to_currency @product.daily_amount} a day" %></p> 
</section> 


<section class="people"> 

    <h2>Or if you create and sell a product</h2> 
     <table> 
     <p class="lead"><%= "To make #{@product.revenue } 10,000 people to buy a 
     #{number_to_currency @product.create_and_sell_product_10000} product" %><br/> 

     <%= "To make #{@product.revenue } 5,000 people to buy a 
     #{number_to_currency @product.create_and_sell_product_5000} product" %><br/> 

     <%= "To make #{@product.revenue } 2,000 people to buy a 
     #{number_to_currency @product.create_and_sell_product_2000} product" %><br/> 

     <%= "To make #{@product.revenue } 1,000 people to buy a 
    #{number_to_currency @product.create_and_sell_product_1000} product" %><br/> 

     <%= "To make #{@product.revenue } 100 people to buy a 
    #{number_to_currency @product.create_and_sell_product_100} product" %></p> 
     </table> 
</section> 

ऊपर जाने तत्व यह पता चलता है चौड़ाई% पट्टी पर तत्व का निरीक्षण

लॉग को देखकर उसे नहीं ढूंढ रहा oll लेकिन इसकी चौड़ाई तत्व ऊपर जाने दिखा रहा है, (पिछला स्क्रीनशॉट देखें)

Started GET "/products/scroll.js" for 127.0.0.1 at 2017-08-14 12:27:17 +0100 
Processing by ProductsController#show as JS 
    Parameters: {"id"=>"scroll"} 
    Product Load (0.4ms) SELECT "products".* FROM "products" WHERE "products"."id" = $1 LIMIT $2 [["id", 0], ["LIMIT", 1]] 
Completed 404 Not Found in 3ms (ActiveRecord: 0.4ms) 

ActiveRecord::RecordNotFound (Couldn't find Product with 'id'=scroll): 

app/controllers/products_controller.rb:67:in `set_product' 

उत्पादों controller.rb

def set_product 
     @product = Product.find(params[:id]) 
    end 

मैं अपने मार्गों में इस राशि

Rails.application.routes.draw do 
    resources :products 

    root 'products#new' 
end 


Started POST "/products" for 127.0.0.1 at 2017-08-16 17:03:11 +0100 
Processing by ProductsController#create as HTML 
    Parameters: {"utf8"=>"✓", "authenticity_token"=>"ZU4tSNn0PsbSL2CTB45yIuBlrn5OePTYPSbIcdKThzJuu/k7GsiIhFf7JJ98pC5NmhGVg5QyekokpzR1s4tv4A==", "product"=>{"revenue"=>"2000", "months"=>"2"}, "commit"=>"Show Me How Much to Charge!"} 
    (0.9ms) BEGIN 
    SQL (3.5ms) INSERT INTO "products" ("revenue", "months", "created_at", "updated_at") VALUES ($1, $2, $3, $4) RETURNING "id" [["revenue", "2000.0"], ["months", 2], ["created_at", "2017-08-16 16:03:11.679460"], ["updated_at", "2017-08-16 16:03:11.679460"]] 
    (46.6ms) COMMIT 
Redirected to http://localhost:3000/products/82 
Completed 302 Found in 57ms (ActiveRecord: 51.0ms) 


Started GET "/products/82" for 127.0.0.1 at 2017-08-16 17:03:11 +0100 
Processing by ProductsController#show as HTML 
    Parameters: {"id"=>"82"} 
    Product Load (0.3ms) SELECT "products".* FROM "products" WHERE "products"."id" = $1 LIMIT $2 [["id", 82], ["LIMIT", 1]] 
    Rendering products/show.html.erb within layouts/application 
    Rendered products/show.html.erb within layouts/application (7.2ms) 
Completed 200 OK in 398ms (Views: 395.0ms | ActiveRecord: 0.3ms) 


Started GET "/products/scroll.js" for 127.0.0.1 at 2017-08-16 17:03:12 +0100 
Processing by ProductsController#show as JS 
    Parameters: {"id"=>"scroll"} 
    Product Load (0.3ms) SELECT "products".* FROM "products" WHERE "products"."id" = $1 LIMIT $2 [["id", 0], ["LIMIT", 1]] 
Completed 404 Not Found in 1ms (ActiveRecord: 0.3ms) 



ActiveRecord::RecordNotFound (Couldn't find Product with 'id'=scroll): 

app/controllers/products_controller.rb:67:in `set_product' 

Answer 1

यह त्रुटि

ActiveRecord :: RecordNotFound

गलत संपत्ति पथ से शुरू हो रहा है ('आईडी' = स्क्रॉल के साथ उत्पाद नहीं मिल सका)। जब आप app/layouts/application.html.erb गौर, तो आप इस

<script src="scroll.js"></script> 

src के लिए यूआरएल गलत है देखेंगे। इसके बाद /products/scroll.js के रूप में कार्य किया गया जो /products/:id के साथ संघर्ष करता है और इसके परिणामस्वरूप त्रुटि होती है। /app/assets/javascripts फ़ोल्डर में आपके पास scroll.js है, इसलिए आपको /assets/scroll.js का उपयोग करने की आवश्यकता है। नीचे पसंद करने के लिए इसे बदलने त्रुटि

<script src="/assets/scroll.js"></script> 

या

बस इस

//= require scroll 

जो

<script src="/assets/scroll.js?body=1"></script> 

उत्पन्न करता है जैसे कि यह शामिल करके application.js से इसे कहते ठीक करना चाहिए मेरा सुझाव है कि आपपढ़ लेंबेहतर समझने के लिए।