javascript - 根据表单输入生成动态 url

标签 javascript jquery ruby-on-rails coffeescript ruby-on-rails-4

我需要根据两个下拉输入生成一个 url,来自货币和两种货币,这样当用户单击提交按钮时,生成的 url 应该类似于 http://localhost:3000/currencies/usd-eur 当表单货币是 usd 并且 to_currency 是 eur 例如。

这是我的观点(index.html.erb)

 <%= semantic_form_for :calculator, :url => {:controller => "conversions", :action => "calculate" }  do |f| %>
      <p><%= f.label :amount %>
      <%= f.text_field :amount %></p>
      <p><%= f.label :from_currency %>
      <%= select :calculator, :from_currency, Choices['from_currency'] %></p>
      </p><%= f.label :to_currency %>
      <%= select :calculator, :to_currency, Choices['to_currency'] %></p>
       <p><%= f.submit "Calculate" %></p>
<%= end %>

路线.rb

match 'currencies', to: 'conversions#index', via: :get
match 'currencies/convert', to: 'conversions#calculate', as: :calculate, via: :post

Controller (conversions_controller.rb)

def index
 end

 def calculate
  @amount = params[:calculator][:amount]
  @from_cur = params[:calculator][:from_currency]
  @to_cur = params[:calculator][:to_currency]
  @result = ConversionsHelper.calculate(@from_cur, @to_cur, @amount)
 end

因为我从谷歌 API 获取数据,所以我没有任何模型可以解决这个问题,因此我可能会超出 RESFFUL 约定的范围。一个详细的答案将不胜感激。谢谢。

最佳答案

这段 javascript 代码最终解决了我的问题。

  $(document).ready(function(){
        $('#Cal').attr('action', '/currencies');
        $("#Cal").submit(function(e){            
            var from = $('#calculator_from_currency').val().toLowerCase();
            var to = $('#calculator_to_currency').val().toLowerCase();
            var url_end = from + "-" + to;
            var url = $('#Cal').attr('action') + '/' + url_end;
            $('#Cal').attr('action', url);            
        });
    });

然后我在我的 route 添加了这一行。

  post '/currencies/:url' => 'conversions#calculate', via: [:post]

关于javascript - 根据表单输入生成动态 url,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19058303/

相关文章:

javascript - 是否可以使用 JavaScript 将 SVG 对象坐标设置为可变变量?

javascript - MutationObserver 未检测到额外的表行

Jquery 查找所有以字符串开头的 ID?

jquery - jquery 排序在浏览器中无法正常工作(Opera、Chrome)

ruby-on-rails - rails : text_method of collection_select

ruby-on-rails - 从 Rails 应用程序 Controller 中调用 ruby​​ 脚本

javascript - 对象数组的拼接函数

javascript - angular2 rc6 - systemjs.config.js 使用子文件夹/src/app

javascript - 在 Javascript 中查找子字符串并添加/附加一些字符

ruby-on-rails - Heroku 错误 H13