为什么一些JS行为在开发中起作用，但是当我推到Heroku时呢？ [英] Why does some JS behavior work in development, but not when I push to Heroku?

问题描述

下面是一个例子 - http://jsfiddle.net/XnPZF/ - 它的工作原理（它也适用于开发）。

只是不知道为什么当我推送到Heroku时这不起作用。

这是一个 Heroku版本。

登录凭证：abc @ test .com / test123

应该在其下面触发其他字段的字段是Property_Type&类别。

以下是一些代码片段：

/ views / listings /new.html.erb

 <％= simple_form_for @listing，：html => {：class => 'form-horizo​​ntal'}} do | f | ％GT; 
<％= f.error_notification％> 
< fieldset> 
<％= f.association：property_type％> 
 
< div style =display：none; data-show-for-prop-type =Multi Family> 
< h4>多家庭< / h4> 
 <％= f.input：taxes％> 
 <％= f.input：house_families％> 
<％= f.input：house_extensions％> 
<％= f.input：house_stories％> 
<％= f.input：house_units％> 
< / div> 
 
< div style =display：none;数据显示换丙型=公寓> 
< h4> Condo< / h4> 
 <％= f.input：taxes％> 
<％= f.input：common_charges％> 
< / div> 
  

listing.js file： var option = $（this'$'） ）.find（'：selected'）;
$（'[data-show-for-prop-type]'）。hide（）; //也许重置？
$（'[data -show-for-prop-type ='+ option.text（）+']'）。show（）;
}）;

解决方案

在realty-cloud.herokuapp上看到几个JS错误。 com / listings / new ...Uncaught TypeError：无法读取未定义的属性'oApi'。几乎肯定可能是这个问题。

Dev没有问题的原因是因为在dev中，它是单独的资产，所以错误仅限于那个js文件与该错误。然而，由于资产管道编译为一个，所以错误会阻止其余的执行。

最好的办法是修复所有控制台错误，或添加未定义检查以防止Uncaugh TypeError错误。

I am trying to create a step form - which triggers/shows some fields when something else is chosen.

Here is an example - http://jsfiddle.net/XnPZF/ - of it working (it also works in development).

Just can't figure out why this doesn't work when I push to Heroku.

Here is a version on Heroku.

Login credentials: [e-mail]/test123

The fields that should trigger other fields right below it are Property_Type & Category.

Here is a snippet of some code:

/views/listings/new.html.erb

<%= simple_form_for @listing, :html => { :class => 'form-horizontal' } do |f| %>
<%= f.error_notification %>
      <fieldset>
            <%= f.association :property_type %>

    <div style="display: none;" data-show-for-prop-type="Multi Family">
      <h4>Multi-Family</h4>
      <%= f.input :taxes %>
      <%= f.input :house_families %>
      <%= f.input :house_extensions %>
      <%= f.input :house_stories %>
      <%= f.input :house_units %>
    </div>

    <div style="display: none;" data-show-for-prop-type="Condo">
      <h4>Condo</h4>
      <%= f.input :taxes %>
      <%= f.input :common_charges %>
    </div>

The listings.js file:

$('#listing_property_type_id').on('change', function(){
    var option = $(this).find(':selected');
    $('[data-show-for-prop-type]').hide(); //And maybe reset?
    $('[data-show-for-prop-type='+ option.text() +']').show();
}); 

解决方案

Seeing several JS errors on realty-cloud.herokuapp.com/listings/new... "Uncaught TypeError: Cannot read property 'oApi' of undefined". Almost positive that might be the issue.

The reason Dev did not have the problem is because in dev, it was separate assets, therefore the error was confined to that one js file with that error. However since the asset pipeline compiles into one, errors stop the rest of it's execution.

Best bet, fix all console errors, or add "undefined" checks to prevent those such "Uncaugh TypeError" errors.

这篇关于为什么一些JS行为在开发中起作用，但是当我推到Heroku时呢？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！