基于表单输入生成动态url

I need to generate a url based on two drop-down inputs, from currency and two currency such that when a user clicks submit button, the url generated should look like http://localhost:3000/currencies/usd-eur when form currency is usd and to_currency is eur for example.

我需要基于两个下拉输入(货币和两种货币)生成一个url，以便当用户单击submit按钮时，在表单货币为usd, to_currency为eur时，生成的url应该类似于http://localhost:3000/currency /usd-eur。

Here's my views(index.html.erb)

这是我的观点(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 %>

routes.rb

routes.rb

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

controller(conversions_controller.rb)

控制器(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

I don't have any models for that matter since I get my data from google API hence I could be going outside the boundaries of RESFFUL conventions. A detailed answer would be appreciated. Thanks.

我没有任何模型，因为我从谷歌API获取数据，所以我可以超越RESFFUL惯例的界限。如能得到详细的答复，将不胜感激。谢谢。

4 个解决方案

#1

This javascript code ended up solving my problem.

这个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);            
        });
    });

Then I added this line in my routes.

然后我把这条线加到我的路径中。

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

#2

try using jquery, to pick your values from the form. then set the url by

尝试使用jquery从表单中选择值。然后设置url by

 $('form#currency_form').attr('action', url);

in side your form

在一边表单

update

in your routes file use these routes:

在您的路由文件中使用以下路由:

match '/currencies/', to: 'converter#show',   via: [:post]
  post '/currencies/:url_end' => 'converter#show'

i hope that helps.

我希望有帮助。

#3

Your goal is a bit outside of restfull and rails conventions. You should eventually learn these as they were developed by people who have been doing this a long time and they will make your life a-lot easier. It seems like your just having fun though so here is some coffee script that will do the job.

您的目标有点超出了restfull和rails约定。你最终应该学会这些，因为它们是由那些做了很长时间的人开发的，它们会让你的生活更轻松。看起来你只是玩得很开心，所以这里有一些可以做这项工作的咖啡脚本。

jQuery ->
  currency_convert_path = ->
    "/currencies/#{$(#id_of_from_currency option:selected).val()}-#{$(#id_of_to_currency option:selected).val()}"

  %("#id_of_from_currency #id_of_to_currency").blur( ->
    $("#id_of_form").attr('action', currency_convert_path())
  )

You will need to inspect element on your form and fill in the id_of_from_currency id_of_form and id_of_to_currency to the actual ids. Then when you change your selects you can inspect the form before submit and see your new action.

您将需要检查表单中的元素，并将id_of_from_currency id_of_form和id_of_to_currency填入实际的id。然后，当您更改选择时，您可以在提交之前检查表单并查看新的操作。

I am also assuming that the value of the option tags are formated like usd and eur. If not you will either need to change them for the above code to have the desired effect.

我还假设选项标签的值是像usd和eur这样的形式。如果没有，您需要对上面的代码进行更改，以达到预期的效果。

#4

Ahh like mu is too shor said sorry I made a boo boo

啊，就像mu太shor说抱歉我犯了一个错误

Change

改变

"/currencies/#{$(#id_of_from_currency option:selected).val()}-#{$(#id_of_to_currencyoption:selected).val()}"

to

来

"/currencies/#{$('#id_of_from_currency option:selected').val()}-#{$('#id_of_to_currency option:selected').val()}"

Notice the '' inside the $()'s

注意$()的内部