title: form_tag with :remote => true does not update div, skips to separate page
body: <p>I am trying to update a div based on a form submit. I am on Rails 3.1.1. I am trying to adapt someone else's <a href="http://jmvidal.cse.sc.edu/talks/rubyonrails/form_remote_tag.html" rel="nofollow">recipe</a>. My code in the view is something like this in <code>main.html.erb</code>:</p>
  
  <pre><code>&lt;%= javascript_include_tag :defaults %&gt;
  &lt;div id='seq_search'&gt;
    &lt;%= form_tag(:remote =&gt; true, :update =&gt; 'seq_select', :action =&gt; 'select')  do %&gt;
      &lt;p&gt;
        &lt;%= search_field_tag  :query, '', :size =&gt; 45 %&gt;
      &lt;/p&gt;
      &lt;p&gt;
        &lt;%=submit_tag "Submit", :disable_wth =&gt; "Adding ..."%&gt;
      &lt;/p&gt;
     &lt;% end %&gt;
  &lt;/div&gt;
  
  &lt;div id='seq_select'&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>The controller looks like</p>
  
  <pre><code>class SearchAjaxController &lt; ApplicationController
    def main
    end
    def select
        render :text =&gt; '&lt;li&gt; '+params[:query] + ' &lt;/li&gt;'
    end
  end
  </code></pre>
  
  <p>However, when I enter something in the text box and press submit, instead of updating the div, it goes off to another page rendering just the output of the <code>select</code> method of the controller.</p>
  
  <p>If I look at the page source of the form, it is something like this:</p>
  
  <pre><code>&lt;div id='seq_search'&gt;
    &lt;form accept-charset="UTF-8" action="/search_ajax/select?remote=true&amp;amp;update=seq_select" method="post"&gt;&lt;div style="margin:0;padding:0;display:inline"&gt;&lt;input name="utf8" type="hidden" value="&amp;#x2713;" /&gt;&lt;input name="authenticity_token" type="hidden" value="wlOm4H7GvZAQoIVpjxPLqHAQLOIpJ4V5r0WYEpvCCrQ=" /&gt;&lt;/div&gt;
      &lt;p&gt;
        &lt;input id="query" name="query" size="45" type="search" value="" /&gt;
      &lt;/p&gt;
      &lt;p&gt;
        &lt;input disable_wth="Adding ..." name="commit" type="submit" value="Submit" /&gt;
      &lt;/p&gt;
  &lt;/form&gt;&lt;/div&gt;
  
  &lt;div id='seq_select'&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>It seems that the form is simply passing <code>remote=true&amp;amp;update=seq_select</code> as arguments to the controller's method/function. Is this what is supposed to happen?</p>
  
  <p><strong>Update:</strong></p>
  
  <p>So I tried to add to follow Mike Campbell's sugggestion and added the following code to my view (`.html.erb') file</p>
  
  <pre><code>&lt;SCRIPT type='text/Javascript'&gt; 
  $(function(){
    $('#form-id').bind('ajax:success', function(xhr, data, status){
      $('#seq_select').html(data);
    });
  }
  &lt;/SCRIPT&gt;
  </code></pre>
  
  <p>and also gave an id to the form:</p>
  
  <pre><code> &lt;%= form_tag(:remote =&gt; true, :update =&gt; 'seq_select', :action =&gt; 'select', :id =&gt; 'form-id')  do %&gt;
  </code></pre>
  
  <p>Submitting the form still doesn't update the page. It simply skips to a new rendered view as before. The generated HTML reads:</p>
  
  <pre><code>&lt;SCRIPT type='text/Javascript'&gt; 
  $(function(){
    $('#form-id').bind('ajax:success', function(xhr, data, status){
      $('#seq_select').html(data);
    });
  }
  &lt;/SCRIPT&gt;
  
  &lt;div id='seq_search'&gt;
    &lt;form accept-charset="UTF-8" action="/ajax_search/select/form-id?remote=true&amp;amp;update=seq_select" method="post"&gt;&lt;div style="margin:0;padding:0;display:inline"&gt;&lt;input name="utf8" type="hidden" value="&amp;#x2713;" /&gt;&lt;input name="authenticity_token" type="hidden" value="wlOm4H7GvZAQoIVpjxPLqHAQLOIpJ4V5r0WYEpvCCrQ=" /&gt;&lt;/div&gt;
      &lt;p&gt;
        &lt;label&gt; Search by identifiers, accessions, and gene names.. &lt;/label&gt;
      &lt;/p&gt;
      &lt;p&gt;
        &lt;input id="query" name="query" size="45" type="search" value="" /&gt;
      &lt;/p&gt;
      &lt;p&gt;
        &lt;input disable_wth="Adding ..." name="commit" type="submit" value="Submit" /&gt;
      &lt;/p&gt;
  &lt;/form&gt;&lt;/div&gt;
  
  &lt;div id='seq_select'&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>Update:</p>
  
  <p>It seems that the syntax for form_tag was wrong, and the first argument has to be the name of the action. I now have <code>&lt;%= form_tag( 'select', :remote =&gt; true, :id =&gt; 'form_id')  do %&gt;</code> which generates the associated HTML <code>&lt;form accept-charset="UTF-8" action="select" data-remote="true" id="form_id" method="post"&gt;</code>. Which is better, but my Ajax is still not working.</p>