0

我从下拉菜单中获得的两个值制作自定义网址时遇到了一点问题。我正在尝试使用jquery。这两个值的 id 为

#convertor_from_currency
#convertor_to_currency

jQuery：

<script>
    $(document).ready(function(){
        $("#currency_form").submit(function(e){
            e.preventDefault();
            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;
            $('#currency_form').attr('action', url);
            $('#currency_form').submit();
            //alert(url);
        });
 </script>

这是表单的标记：

<%= form_for :convertor , :html => {:id => "currency_form"}, :url => {:controller => "converter", :action => "show" } do |f| %>
    <%= f.label :from_currency %>
    <%= f.select :from_currency, options_for_select(currencies,  @from_cur)  %>

    <%= f.label :to_currency %>
    <%= f.select :to_currency, options_for_select(currencies,  @to_cur), :required => true %>
    <%= f.submit "Calculate", class: "btn btn-large btn-primary", id: "submitButton" %> 
<% end %>

路线

root 'converter#index'
# get "converter/show"
match '/currencies/', to: 'converter#show',   via: [:post]

在提交时，我希望网址为：

'/currencies/url_end

其中“url_end”是表单中提交的值的串联：

 #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

我该怎么做呢？任何想法都会受到赞赏，即使它使用 jquery/javascript 以外的其他方式

4

2 回答 2

1

你可以尝试重写这条路线：

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

至：

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

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

更新：

  1. 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>

只要您在提交处理程序中，就不应在表单上调用提交。相反，您应该使用 $.post(...) 提交表单数据。表单数据可以像我的示例中那样序列化，以使用 $.post() 发送。您应该添加“});” 在结束标记之前。

  1. 应该适合您的路由配置之一：

    匹配 '/currencies/' => 'converter#index'，如： :converter match '/currencies/:from-:to' => 'converter#show'，通过： [:post]

    您的表单应使用 converter_path 助手作为操作 url。并且 JS 代码应该将表单提交到 /currencies/:from-:to。

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

    {:id => "currency_form"}, :url => 转换器路径做 |f| %>

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

    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) 渲染文本：“文本”结束

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

于 2013-09-28T09:46:34.763 回答
1

这可以帮助（它对我有用）

<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'

然后点赞！！！！

于 2013-09-30T09:15:37.127 回答