title: Ruby on Rails, Low Pro, and JQuery (through JRails)
body: <p>I am using <a href="http://ennerchi.com/projects/jrails" rel="nofollow noreferrer">JRails</a> with Ruby on Rails so that I can simply use jQuery since I am more familiar with it. I am also attempting to use <a href="http://github.com/danwrong/low-pro-for-jquery/tree/master/" rel="nofollow noreferrer">Low Pro</a> to submit some of my forms remotely.</p>
  
  <p>I am currently running into an interesting problem that has me stumped. I have added the following to my <code>application.js</code> file and I know that these are working correctly because I am seeing the response returned (using Firebug in Firefox):</p>
  
  <pre><code>$.ajaxSetup({
    dataType: "script"
  });
  
  $(function() {
    $('a.remote').attach(Remote.Link);
    $('form.remote').attach(Remote.Form);
  });
  </code></pre>
  
  <p>All I have to do is add <code>class="remote"</code> to my links and my forms and everything works great. The <code>dataType: "script"</code> part makes sure that it does an <code>eval()</code> on the returned response text so that it can update the page correctly.</p>
  
  <p>So, I have a simple link that creates a new shipment. In my <code>new.js.rjs</code> file I have the following:</p>
  
  <pre><code>page.insert_html :bottom, '#shipments_table',
      :partial =&gt; 'test', :locals =&gt; { :shipment =&gt; @shipment }
  </code></pre>
  
  <p>If I replace this with <code>page.visual_effect :fade, '#shipments_table'</code> it does that as you would expect. If my <code>_test.html.erb</code> file is fairly simple, it also works. The problem is when I attempt to add a <code>&lt;form&gt;</code> to my partial. Different problems arise depending upon the placement of the <code>&lt;form&gt;</code> tags. For example, this</p>
  
  <pre><code>&lt;tr&gt;
    &lt;form&gt;
      &lt;td&gt;Some Text&lt;/td&gt; 
    &lt;/form&gt;
  &lt;/tr&gt;
  </code></pre>
  
  <p>and this</p>
  
  <pre><code>&lt;form&gt;
    &lt;tr&gt; 
      &lt;td&gt;Some Text&lt;/td&gt; 
    &lt;/tr&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>make absolutely nothing appear. This</p>
  
  <pre><code>&lt;form&gt;&lt;/form&gt;
  &lt;tr&gt; 
    &lt;td&gt;Some Text&lt;/td&gt; 
  &lt;/tr&gt;
  </code></pre>
  
  <p>will make <code>Some Text</code> appear, but it loses all of my formatting. And this</p>
  
  <pre><code>&lt;tr&gt; 
    &lt;td&gt;Some Text&lt;/td&gt; 
  &lt;/tr&gt;
  &lt;form&gt;&lt;/form&gt;
  </code></pre>
  
  <p>works exactly how I need (visually speaking). However, the obvious downside to this is that I can't put my form inputs into the table columns, which basically makes the whole process useless. I can probably work around this by simply putting them all on one line inside of a <code>&lt;div&gt;</code> or something similar, but I would prefer that everything be aligned.</p>
  
  <p>Any ideas as to how to solve this conundrum would be greatly appreciated :-)</p>