Javascript rails：表单提交时应该转到一个自定义url，其中包含两个下拉菜单的值

从下拉菜单中获取的两个值生成自定义url时，我遇到了一个小问题。 我正在尝试使用jquery来实现这一点。这两个值的ID如下所示

#convertor_from_currency
#convertor_to_currency

jquery： 提交时，我希望url为：

'/currencies/url_end

其中“url_end”是以以下形式提交的值的串联：

 #convertor_from_currency
    #convertor_to_currency

更新，这是我的控制器。

类转换器控制器

我该怎么做？

---

任何想法都将受到欢迎，即使它使用的是jquery/javascript以外的另一种方式，您可以尝试重写此路径：

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

致：

在这种情况下，对（例如）/货币/usd eur的请求将路由到converter#show，您将能够使用params[from]和params[：to]访问控制器操作中的货币

更新：

javascript代码中存在错误：

此代码应按预期工作：

<script>
$(document).ready(function(){
    $("#currency_form").submit(function(e){
        var from = $('#convertor_from_currency').val();
        var to = $('#convertor_to_currency').val();
        var url_end = from + "-" + to;
        var url = $('#currency_form').attr('action') + '/' + url_end;

        $.post(url, $('#currency_form').serialize(), function(data){alert('success');});
        alert(url);
        e.preventDefault();
        return false;
    });
  });
 </script>

$（文档）.ready（函数（）{
$（“#货币表格”）。提交（功能（e）{
var-from=$（'#convertor_-from_-currency'）.val（）；
var to=$（'#convertor_to_currency'）.val（）；
var url_end=from+“-”+to；
var url=$（'#货币形式'）.attr（'action'）+'/'+url\u end；
$.post（url，$（'#currency_form'）.serialize（），函数（data）{alert（'success'）；}）；
警报（url）；
e、 预防默认值（）；
返回false；
});
});

只要您在提交处理程序中，就不应该在表单上调用submit。相反，您应该使用$.post（…）来提交表单数据。表单数据可以序列化，如我的示例中所示，使用$.post（）发送。您应该在结束标记之前添加“}）；”

应适用于您的其中一种路由配置：

将“/currences/”=>“converter#index”匹配为：：converter 匹配“/currences/：from-：到“=>”转换器#show”，通过：[：post]

表单应使用converter_path helper作为操作url。JS代码应该将表单提交到/currences/:from-:to

您需要将视图中的表单更新为：

{:id=>currency_form}，:url=>converter_path do | f |%>

您可以在控制器中使用此示例代码，以确保正确提交表单：

def秀 @金额=参数[：转换器][：金额] @from\u cur=params[：转换器][：from\u currency] @to_cur=参数[：转换器][：to_货币]

#@结果=ConverterHelper.show（@from\u cur，@to\u cur，@amount） 渲染文本：“文本” 结束

一旦看到表单在服务器上得到正确处理，就可以取消对该行的注释并删除渲染。

这会有所帮助（它对我有用）

---

然后向上投票

我可以使用实例变量吗？。因为我得到了这个错误，没有路由匹配{：action=>“show”，：controller=>“converter”}我已经尝试过了，但是路由似乎仍然有问题。请尝试检查我对这个问题的更新，你不认为有一个更简单的方法吗？你能发布你使用我的代码得到的错误吗？作为替代方案，我可以建议对表单使用并指定：remote=>“true”。此任务不需要使用任何JS。

 #convertor_from_currency
    #convertor_to_currency

class ConverterController < ApplicationController
  def index
  end

  def show
     @amount = params[:convertor][:amount]
     @from_cur = params[:convertor][:from_currency]
     @to_cur = params[:convertor][:to_currency]

     @result = ConverterHelper.show(@from_cur, @to_cur, @amount)
  end
end

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

match '/currencies/:from-:to', to: 'converter#show',   via: [:post]

<script>
$(document).ready(function(){
    $("#currency_form").submit(function(e){
        var from = $('#convertor_from_currency').val();
        var to = $('#convertor_to_currency').val();
        var url_end = from + "-" + to;
        var url = $('#currency_form').attr('action') + '/' + url_end;

        $.post(url, $('#currency_form').serialize(), function(data){alert('success');});
        alert(url);
        e.preventDefault();
        return false;
    });
  });
 </script>

<script>
$(document).ready(function(e){
    $("#currency_form").submit(function(){
        var from = $('#convertor_from_currency').val();
        var to = $('#convertor_to_currency').val();
        var url_end = from + "-" + to;
        var url = $('#currency_form').attr('action') + '/' + url_end;
        $('form#currency_form').attr('action', url);
        // window.location.href = url
        e.preventDefault();
        alert(url);
        return false;
    });
  });
 </script>

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