javascript - 使用咖啡脚本自动更新值
问题描述
我是使用 JS 的新手,所以我在这里遇到问题 rsrs
一旦用户开始在金额字段上插入值,我需要自动更新结果字段
$(document).ready ->
$('form').submit ->
if $('form').attr('action') == '/convert'
$.ajax '/convert',
type: 'GET'
dataType: 'json'
data: {
source_currency: $("#source_currency").val(),
target_currency: $("#target_currency").val(),
amount: $("#amount").val()
}
error: (jqXHR, textStatus, errorThrown) ->
alert textStatus
success: (data, text, jqXHR) ->
$('#result').val(data.value)
return false;
现在我有一个调用 /convert 的提交按钮,但是我怎样才能删除它并在我收到值时调用 API,不完整与否
class ExchangeService
def initialize(source_currency, target_currency, amount)
@source_currency = source_currency
@target_currency = target_currency
@amount = amount.to_f
end
def call
value = get_exchange
value * @amount
rescue RestClient::ExceptionWithResponse => e
e.response
end
def get_exchange
exchange_api_url = Rails.application.credentials[Rails.env.to_sym][:currency_api_url]
exchange_api_key = Rails.application.credentials[Rails.env.to_sym][:currency_api_key]
url = "#{exchange_api_url}?token=#{exchange_api_key}¤cy=#{@source_currency}/#{@target_currency}"
result = RestClient.get url
JSON.parse(result.body)['currency'][0]['value'].to_f
end
end
解决方案
您可以使用Rails 中的remote: true来发出 AJAX 请求:
一个带有 Car 资源的简单示例:
汽车控制器.rb
def create
@car = Car.new(car_params)
respond_to do |format|
if @car.save
format.js
else
format.js
end
end
end
_form.html.erb
<%= form_with(model: car, local: false) do |form| %>
<% if car.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(car.errors.count, "error") %> prohibited this car from being saved:</h2>
<ul>
<% car.errors.each do |error| %>
<li><%= error.full_message %></li>
<% end %>
</ul>
</div>
<% end %>
<div class="field">
<%= form.label :name %>
<%= form.text_field :name %>
</div>
<div class="actions">
<%= form.submit %>
</div>
<% end %>
创建.js.erb
console.log('<%= @car.name %>');
所以,当你提交你的 rails 表单时,请求会像 JS 一样。您的控制器需要接受这种格式(format.js),当控制器处理数据时,流程继续执行操作,但在此文件中使用 js 扩展名(create.js.erb),您可以制作您想要的内容,附加数据,替换数据,改变值,可以使用Ruby + JS 希望对你有用,原谅我的英文不好
推荐阅读
- ios - 以编程方式将页脚视图添加到视图控制器
- sql - PostgreSql:使用横向连接的 Json 数组到行
- android - 选项卡式布局不会在滚动时折叠
- c++ - 使用英特尔 OpenMP 找到最佳线程数:只有 1 个线程比多线程有更好的结果
- gun - gun.map() 在根节点上的期望行为是什么?
- django - 为什么在保存时更新相关模型中的字段在 Django 中不起作用?
- java - SD 卡中的文件消失
- java - 如何使用 ANTLR 4 实现逻辑运算符(和,或)?
- c++ - what() const throw 是什么意思?
- javascript - 组件未在 reactJS 中呈现