2016-06-07 32 views
2

我使用Ruby on Rails应用程序与Materialise CSS结合使用。Javascript只在刷新后加载(Ruby on Rails - 实现CSS)

导航中的链接下拉菜单可在仪表板上运行,但在任何其他页面上,您必须先刷新它。按钮和选项卡上的Wave效果相同。 我已经尝试了20种左右的解决方案,但他们没有工作。

我也有未链接物化CSS一个多形式的JavaScript。它用在特定页面上的脚本标记中。

$(document).ready(function() { 
    // get all items 
    var navListItems = $('div.setup-panel div a'), 
     allParts = $('.setup-content'), 
     allNextBtn = $('.nextBtn'), 
     allPrevBtn = $('.prevBtn'); 

    allParts.hide(); 

    navListItems.click(function (e) { 
     e.preventDefault(); 
     var $target = $($(this).attr('href')), 
      $item = $(this); 
     // hide when disabled 
     if (!$item.hasClass('disabled')) { 
     navListItems.removeClass('btn-primary').addClass('btn-default'); 
     $item.addClass('btn-primary'); 
     allParts.hide(); 
     $target.show(); 
     $target.find('input:eq(0)').focus(); 
     } 
    }); 
    // previous 
    allPrevBtn.click(function(){ 
     var curStep = $(this).closest(".setup-content"), 
      curStepBtn = curStep.attr("id"), 
      prevStepWizard = $('div.setup-panel div a[href="#' + curStepBtn + '"]').parent().prev().children("a"); 

     prevStepWizard.removeAttr('disabled').trigger('click'); 
    }); 
    //next 
    allNextBtn.click(function(){ 
     //setup next part 
     var curStep = $(this).closest(".setup-content"), 
      curStepBtn = curStep.attr("id"), 
      nextStep = $('div.setup-panel div a[href="#' + curStepBtn + '"]').parent().next().children("a"), 
      curInputs = curStep.find("input[type='text']"), 
      curRadios = curStep.find("input[type='radio']"), 
      curChecks =curStep.find("input[type='checkbox']"), 
      isValid = true; 

     if (curStep.hasClass('step1')){ 
     var txt = ""; 
     if (document.getElementById("snapshot_name").value == null || document.getElementById("snapshot_name").value == "") { 
      txt = "You need to fill in a snapshot name"; 
      document.getElementById("error1").innerHTML = txt; 
     }else{ 
      document.getElementById("error1").innerHTML = txt; 
      goToNext(nextStep) 
     } 
     } else if (curStep.hasClass('step2')){ 
     var txt2 = ""; 
     var counter = 0; 
     var counterQ1 = 0; 
     var counterQ2 = 0; 
     for(var i=0; i<curRadios.length; i++){ 
      if (curRadios[i].checked){ 
      counter++ 
      } 
     } 
     for(var i=0; i<curChecks.length; i++){ 
      if (curChecks[i].checked){ 
      var name = curChecks[i].id; 
      if (name.search(/Q1/i)){ 
       counterQ1++ 
      }else { 
       counterQ2 ++ 
      } 

      } 
     } 

     if (counter == (1) && counterQ1 > 0 && counterQ2 > 0){ 
      document.getElementById("error2").innerHTML = txt2; 
      goToNext(nextStep) 
     } else{ 
      txt2 = "You need to fill in all questions" 
      document.getElementById("error2").innerHTML = txt2; 
     } 
     } 
     else if (curStep.hasClass('step3')){ 
     var txt3 = ""; 
     var counter = 0; 
     var counterQ1 = 0; 
     var counterQ2 = 0; 
     for(var i=0; i<curRadios.length; i++){ 
      if (curRadios[i].checked){ 
      counter++ 
      } 
     } 

     if (counter == (5)){ 
      document.getElementById("error3").innerHTML = txt3; 
      goToNext(nextStep) 
     } else{ 
      txt3 = "You need to fill in all questions" 
      document.getElementById("error3").innerHTML = txt3; 
     } 
     } 

     else if (curStep.hasClass('step6')){ 
     var txt6 = ""; 
     var counter = 0; 
     for(var i=0; i<curRadios.length; i++){ 
      if (curRadios[i].checked){ 
      counter++ 
      } 
     } 

     if (counter == (14)){ 
      document.getElementById("error6").innerHTML = txt6; 
      goToNext(nextStep) 
     } else{ 
      txt6 = "You need to fill in all questions" 
      document.getElementById("error6").innerHTML = txt6; 
     } 
     } 
     else { 
     goToNext(nextStep) 
     } 

    }); 

    $('div.setup-panel div a.btn-primary').trigger('click'); 
    }); 

    function goToNext(nextStep){ 
     nextStep.removeAttr('disabled').trigger('click'); 
     nextStep.removeClass('disabled').trigger('click'); 
    } 

任何人都有一个想法我可以尝试什么样的解决方案?

回答

2

我删除了application.js中的require turbolinks。 我之前尝试过,但后来没有奏效。 现在确实如此。 非常感谢那些试图帮助的人。