Javascript函数没有被select字段onchange调用

时间:2017-03-28 18:18:56

标签: javascript jquery ruby-on-rails coffeescript

我在views / touches / new中的表单中有一个select字段:

{
  "name": "LumaHealth",
  "version": "1.0.0",
  "description": "LumaHealth",
  "main": "start.js",
  "scripts": {
    "start": "webpack --config ./webpack/webpack.config.development.js",
    "build": "webpack --config ./webpack/webpack.config.production.js",
    "clean": "rm build/app.js"
  },
  "repository": {
    "type": "git",
    "url": "git@github.com:lumahealthhq/web-app.git"
  },
  "keywords": [],
  "author": "Marcelo Oliveira",
  "license": "MIT",
  "devDependencies": {
    "babel-cli": "^6.24.0",
    "babel-core": "^6.24.0",
    "babel-eslint": "^7.2.1",
    "babel-plugin-react-require": "^3.0.0",
    "babel-plugin-transform-class-properties": "^6.23.0",
    "babel-preset-env": "^1.2.2",
    "babel-preset-react": "^6.23.0",
    "css-loader": "^0.26.4",
    "enzyme": "^2.0.0",
    "eslint": "^3.7.1",
    "eslint-config-airbnb": "^14.1.0",
    "eslint-loader": "^1.7.0",
    "eslint-plugin-import": "^2.2.0",
    "eslint-plugin-jsx-a11y": "^4.0.0",
    "eslint-plugin-react": "^6.4.1",
    "extract-text-webpack-plugin": "^2.1.0",
    "html-webpack-plugin": "^2.28.0",
    "nyc": "^10.1.2",
    "postcss-loader": "^1.3.3",
    "postcss-nested": "^1.0.0",
    "react-addons-test-utils": "^15.4.1",
    "sinon": "^1.17.2",
    "style-loader": "^0.13.2",
    "sw-precache": "^5.0.0",
    "transfer-webpack-plugin": "^0.1.4",
    "webpack": "^2.3.2",
    "webpack-dev-server": "^2.4.2"
  },
  "dependencies": {
    "babel-core": "^6.5.2",
    "babel-eslint": "^7.0.0",
    "babel-plugin-transform-react-require": "^1.0.1",
    "babel-polyfill": "^6.23.0",
    "co": "^4.6.0",
    "express": "^4.12.3",
    "file-loader": "^0.10.1",
    "humps": "^2.0.0",
    "isomorphic-fetch": "^2.2.1",
    "local-storage": "^1.4.2",
    "lodash": "^4.16.4",
    "material-ui": "^0.17.0",
    "moment": "^2.15.2",
    "q": "^1.4.1",
    "react": "^15.4.1",
    "react-dom": "^15.4.1",
    "react-redux": "^5.0.3",
    "react-router": "^3.0.2",
    "react-router-redux": "^4.0.6",
    "react-slick": "^0.14.4",
    "react-tap-event-plugin": "^2.0.0",
    "react-web-notification": "^0.2.3",
    "redux": "^3.6.0",
    "redux-form": "^6.1.1",
    "redux-logger": "^2.7.0",
    "redux-socket.io": "^1.3.1",
    "redux-thunk": "^2.1.0",
    "socket.io-client": "^1.7.2",
    "url-loader": "^0.5.7",
    "vanilla-masker": "^1.0.9"
  }
}

我试图在assets / javascripts / touches.js.coffee中调用函数“populate”

<%= f.select :touch_type, options_for_select(['Attack', 
'Block','Pass', 'Set']), {include_blank: "Select touch type..."
:onchange => 'populate()'}, class: "form-control" %>

...这样它将填充此选择字段,其中包含特定于此处所示第一个选择字段中所做选择的选项:

jQuery ->
  populate = ->
    s1 = $('#touch_touch_type_id').html()
    s2 = $('#touch_touch_result_id').html()
    s2.html = ""

    if s1.value == "attack"
      optionArray = ["score|Score", "out|Out"]

    for option in optionArray
      pair = optionArray[option].split "|" 
      newOption = document.createElement "option"
      newOption.value = pair[0]
      newOption.html = pair[1]
      s2.options.add newOption

当我在第一个选择字段中更改选项时,没有任何反应。我尝试了一种名为“yell()”的测试方法,看它是否称之为但仍然没有运气。

<%= f.select :touch_result, {}, {include_blank: 
"Select touch result..."}, class: "form-control" %>

不完全确定我的错误所在。

感谢任何帮助。

0 个答案:

没有答案