rails/actionview/app/assets/javascripts/..
视频：https://gorails.com/episodes/rails-ujs-primer?autoplay=1
介绍
This unobtrusive scripting support file 脚本支持Rails，但不严格绑定在任何backend,也可以用在其他任何应用.
- force confirmation dialogs for various actions;
- make non-GET requests from hyperlinks;从超级链接制作非get请求
- make forms or hyperlinks submit data asynchronously with Ajax;用Ajax制作表格或链接提交异步数据
- 当已经点击提交按钮时，自动防止多次点击，导致重复提交。
These features are achieved by adding certain data attributes to your HTML markup.
这些功能是通过增加了data attributes到Http markup来实现的。
⚠️抛弃了jquery，使用coffeescript编译的。新要点：
- You won't get jQuery anymore in your Rails 5.1 applications
- Rails is starting to push you towards building your forms that all submit with AJAX requests
data = new FormData()
使用
rails app 直接在application.js中加上//= reqquire rails-ujs。
如果使用gem Webpacker或者其他的JS bundler，在主要main JS file增加以下代码：
import Rails from 'rails-ujs';
Rails.start()
定义了一些方便的语法糖，比如：
Rails.disableElement(document.getElementById("form_submit"))
解释：让link, button, form, formSubmit元素不能使用。还有enableElement()，让元素可以使用。
在rails/actionview/app/assets/javascripts/rails-ujs/features/disable.coffee文件中定义的。
remote.coffe文件有处理ajax 请求的完美案例格式：⚠️这个格式是coffee格式。
Rails.ajax(
type: method or 'GET'
url: url
data: data
dataType: dataType
# stopping the "ajax:beforeSend" event will cancel the ajax request
# 不能用beforeSend:干别的事情，否则会停止ajax:beforeSend!!
beforeSend: (xhr, options) ->
if fire(element, 'ajax:beforeSend', [xhr, options])
fire(element, 'ajax:send', [xhr])
else
fire(element, 'ajax:stopped')
return false
# success, complete都可以使用。
success: (args...) -> fire(element, 'ajax:success', args)
error: (args...) -> fire(element, 'ajax:error', args)
complete: (args...) -> fire(element, 'ajax:complete', args)
crossDomain: isCrossDomain(url)
withCredentials: withCredentials? and withCredentials isnt 'false'
）
案例：视频5.40分，我也实操成功了✌️
我写了一个只有一个输入框的表格，在chrome-inspect-console上声明一个form格式：
var data = new FormData()
data.append("post[content]", "输入的value")
#post[content]是输入框的name, 具体可见webAPI, 用于附加一个新的value到一个已存在的 key
然后使用:
Rails.ajax({url: '/posts', type:"POST", data: data})
就正确提交了数据✌️，相当于submit。
解释：FormData()会创建空的表格对象。之后使用append("key", "value")附加给这个对象。
Rails.serializeElement()是一个UJS脚本方法。等同于使用传统的FormData(this)
data1 = new FormData(某个表格)， data1获得表格内已有的所有数据对儿。
Csrf.coffee文件
Rails.csrfToken()
"SGFmdd/odcWc625LdYvcwUgi3jt+ou2H7FnKtH448qEksRvE0SHRESMuWS11wNaIrXicnnibw2VDaSeHIJt/tw=="
用于生成随机token。用于api
form.coffee文件
Rails.serializeElement()方法，一次性得到当前表格中已经输入的所有信息。
> var data1 = Rails.serializeElement(document.getElementsByTagName("form")[0])
undefined
> data1
"utf8=%E2%9C%93&authenticity_token=LSfv%2F12dCBYWSg%2FSgNCGQ5n4oV9h1wNBQD4YxqkgAPxB95JOU1SswqmPOLSAm4wKfKLj%2BmfuLaPvDvX194ON6g%3D%3D&post%5Bcontent%5D=xzczxxcz"
> Rails.ajax({url: '/posts', type:"POST", data: data1})
undefined
数据被存入。