2012-01-08 9 views
1

私はレール3.1を使用しています。私はajaxで検索フォームを作成しています。私はすでにポストメソッドを使ってフォームを作成しています。AjaxのクエリとRuby on Rails

<%= form_tag(root_path, :method => "post",:id =>"formid") do %> 
    <%= label_tag(:number1, "El que quiero") %> 
    <%= text_field_tag :quiero, nil, :class => 'drug_autocomplete' %> 
    <%= hidden_field_tag :number1 %> 

    <%= label_tag(:number1, "El modelo que tengo") %> 
    <%= text_field_tag :tengo, nil, :class => 'drug_autocomplete' %> 
    <%= hidden_field_tag :number2 %> 

    <%= label_tag(:size1, "Talla de el que tengo") %> 
    <%= text_field_tag :size1%> 

    <%= submit_tag("Do it!") %> 

<% end %> 

私はsubmitイベントを処理するために何かを書いていました。

jQuery.ajaxSetup({ 
    'beforeSend': function(xhr) {xhr.setRequestHeader("Accept", "text/javascript")} 
}) 

jQuery.fn.submitWithAjax = function() { 
    this.submit(function() { 
    $.post(this.action, $(this).serialize(), null, "script"); 
    return false; 
    }) 
    return this; 
}; 

$(document).ready(function() { 
    $("#form_id").submitWithAjax(); 
}) 

コントローラは、フォームのパラメータを受け取り、このようにデータベースにクエリを作成します。

@itemsok = Contribution.where("first_item_id = ?",item1.id).where("second_item_id = ?",item2.id).where("second_item_grade = ?",size1 

そして、私が達成したいどのような同じビュー

<%if not @itemsok.nil? 
    @itemsok.each do |searches| 
%> 
<table> 
<tr> 
    <td style="width:100px;"><%= searches.first_item.description %> </td> 
    <td style="width:150px; font-size:30px;"><%= searches.first_item_grade %> </td> 


    <td style="width:150px;"><%= searches.second_item.description %> </td> 
    <td style="width:150px; font-size:30px;"><%= searches.second_item_grade %> </td> 
    <td style="width:150px; font-size:18px;"><a href="<%= contribution_path(searches.id) %>">Show</a> </td> 


</tr> 
</table> 

にデシベルで見つかったパラメータを返すデータベースにクエリを作成すると同じですが、Ajaxを使ってページ内にありませんのでリロード必要です。 最初の質問ですが、フォームのデータをjavascriptのどこかで処理する必要があります。 2番目の質問、戻ってきたときにデータを処理するにはどうすればいいですか?

私はAjaxでRailsで完全に失われているので、助けてください。 ありがとうございます。 私のひどい英語のために申し訳ありません。

答えて

2

submitWithAjaxへの関数は、フォームデータを準備するserialize()を呼び出しています。

フォームアクションのコントローラーは、format.js ABOVE format.htmlに応答する必要があり、適切なビューフォルダー内のアクション名と一致するファイルが ".js.erb"拡張子で必要になります。

".js.erb"ファイル内では、任意のjQueryを呼び出してコンテンツを置き換えたり、ページの要素を変更したり、アクションをトリガすることができます。

jQuery.fn.submitWithAjax = function() { 
    this.submit(function() { 
    $.post(this.action + '.js', $(this).serialize(), null, "script"); 
    return false; 
    }) 
    return this; 
}; 

お知らせ」の.js':

$('#lightBoxClose').trigger('click'); 
$('#flashContentContainer').html('<%= escape_javascript(render :partial => "shared/flash_bar") %></div>'); 

もうひとつは、あなたのアプリケーションは、あなたがそうのようなあなたのsubmitWithAjax機能を変更することができますformat.jsアクションで応答を確認することです。

チェックアウトしていない場合は、this railscast

0

Railsのネイティブajaxユーティリティでこれを処理するのが最も簡単です。言い換えれば、あなたのformタグは(remoteのparamに注意してください)、次のようになります。

form_tag(root_path, :method => "post",:id =>"formid", :remote => true) 

これは、あなたがAJAX経由で投稿するために必要なすべてのです。しかし、あなたは応答を処理する必要があります。あなたのjavascriptファイルでは、次の操作を行います。

$('#formid') 
    .bind('ajax:success', function(response) { 
     // response is what gets sent from the controller 
     // so send only the dynamic data and insert it into the DOM 
    } 

はそうでajax:completeajax:errorなど他のAJAXコールバックのRailsの3.1のマニュアルを参照してください。