2016-11-15 51 views
0

我對rails,JavaScript和Ajax很基本。我有軌道查詢使用連接從三個表中檢索數據。我想通過選擇日期選項來檢索數據,並且我想用Ajax或JavaScript來實現。在rails中使用日期檢索數據使用ajax

以下是軌查詢

@query = ItemType.select("name, item_id, sum(quantity) as Total_Quantity_Itemwise, sum(price_value) as Item_Total_Amount, price_value, order_items.created_at Date").joins('INNER JOIN items ON items.item_type = item_types.id', 'INNER JOIN order_items ON order_items.item_id = items.id').group("item_id").order(" order_items.created_at") 

Click to view the result of the query

,也幫助我獲得在底部總量如下一個圖像

<table border="1"> 
    <tr> 
    <th>Item Name</th> 
    <th>Quantity</th> 
    <th>Amount</th> 
    </tr> 
    <% @new_query.each do |results| %> 
    <tr> 
     <td><%= results.name %></td> 
     <td><%= results.Total_Quantity_Itemwise %></td> 
     <td><%= results.Item_Total_Amount %></td> 
    </tr> 
    <% end %> 
    <tr> 
    <th>Total of all rows</th> 
    </tr> 
    <tr> 
    <td></td> 
    </tr> 
    <tr> 
    <td><% @new_query.sum(:price_value) %></td> 
    </tr> 
</table>` 

Click here to view how total to be displayed at bottom

回答

0

在最初的頁面將被加載沒有內容使用html.erb模板,你將有一個空的div與一些id作爲div的參考。

當用戶選擇一個日期,然後點擊一個按鈕,你可以添加一個腳本來聽的點擊事件,使Ajax調用像圖所示

$("#button").click(function() { 
    $.ajax({ 
     url: "/calculate_price", 
     type: "GET", 
     dataType: 'script', 
     data: {date: (#date_field_selector).val()} 
    }); 
}); 

,你可以得到的日期字符串和您可以訪問該值並進行必要的轉換並在查詢中使用它,它會呈現js.erb,您可以將內容放置在我們保存在html中的div內。

在此之前,我們需要創建一個部分文件和HTML部分必須是文件中,你可以發送當地人的部分,並用它來代替可變@new_query

要顯示的總和在底部,您可以創建一個數組變量並繼續推送每個條目的價格,因爲您知道每個條目的總價格,並且可以對數組求和並顯示它。

相關問題