jquery - 在 Rails 3 中使用 jQuery Ajax 查询数据库

Question

我正在尝试构建一个支持多个行项目的估算表单。通过填写以下字段完成估算行项目后:

• 属性
• 高度
• 字母数量

我想查询数据库表以获得单价，然后乘以 letter_quantity 并显示订单项的成本。我的想法是执行查询并从 letter_quantity 字段中显示订单项的 onBlur 成本。

这是我的表格:

<%= nested_form_for @estimate do |f| %>

    <%= f.label :date %><br />
    <%= f.text_field :date %><br />
    <%= f.label :job_name %><br />
    <%= f.text_field :job_name %><br />

    <%= f.fields_for :items do |builder| %>
        <%= builder.label :properties %><br />
        <%= builder.text_field :properties %><br />
        <%= builder.label :height %><br />
        <%= builder.text_field :height %><br />
        <%= builder.label :letter_quantity %><br />
        <%= builder.text_field :letter_quantity %><br />
        <%= builder.link_to_remove "Remove this item" %>
    <% end %>
    <%= f.link_to_add "Add a item", :items %>
<%= f.submit "Add item" %>

<% end %>

我想使用通用的 jQuery ajax 函数来调用执行查询并将成本返回到表单的函数。这是基本模板:

$.ajax({
  url: "test.html",
  context: document.body,
  success: function(){
    $(this).addClass("done");
  }
});

class ItemsController < ApplicationController

    def calculateCost
        #Execute SQL query here
          SELECT unit_price
          FROM CostData
          WHERE properties = form.properties
          AND height = form.height

        #Return unit_price x form.letter_quantity to form
    end

end

最重要的是，如何设置 jQuery Ajax 函数来调用calculateCost 函数？我一直在 Google 上搜索，但找不到这样的示例。

其次，如何在calculateCost函数中设置查询和返回功能？对于这些问题的任何帮助将不胜感激。

Answer 1

在页面顶部包含 jquery 和 jquery.form 插件:

<%= javascript_include_tag "jquery-1.6.2.min.js", "jquery.form" %>


<%= nested_form_for @estimate do |f| %>

    <%= f.label :date %><br />
    <%= f.text_field :date %><br />
    <%= f.label :job_name %><br />
    <%= f.text_field :job_name %><br />

    <%= f.fields_for :items do |builder| %>
        <%= builder.label :properties %><br />
        <%= builder.text_field :properties, :id => "properties_field" %><br />
        <%= builder.label :height %><br />
        <%= builder.text_field :height, :id => "height_field" %><br />
        <%= builder.label :letter_quantity %><br />
        <%= builder.text_field :letter_quantity, :id => "letter_quantity_field" %><br />
        <%= builder.link_to_remove "Remove this item" %>
    <% end %>
    <%= f.link_to_add "Add a item", :items %>
    <%= f.submit "Add item" %>

<% end %>

<script type="text/javascript">
    $("#letter_quantity_field").onBlur(function () {
        var height = $("#height_field").val();
        var properties = $("#properties_field").val();
        $.ajax({
            url: '/items/calculateCost?height=' + height + '&properties=' + properties , type: 'get', dataType: 'html',
            processData: false,
            success: function(data) {
                if (data == "record_not_found") {
                    alert("Record not found");
                }
                else {
                    $("#letter_quantity_field").val(data);
                }
            }
        });
    });
</script>

在你的 Controller 中做类似的事情。

def calculateCost
    @cost_data = CostData.find_by_properties_and_find_by_height(params[:properties], params[:height])
    if @cost_data.blank?
      render :text => "record_not_found"
    else
      render :text => @cost_data.unit_price
    end
  end