Ruby on Rails、Low Pro、JQuery（JRails経由）

Question

Ruby on RailsでJRailsを使用しているので、jQueryを使いこなすことができます。私はLow Proを使って私のフォームのいくつかを遠隔から提出しようとしています。

私は現在、私に困惑している面白い問題にぶつかっています。私は私のapplication.jsファイルに以下を追加していると私は（FirefoxでFirebugのを使用して）応答が返さ見ていたので、私はこれらが正しく機能していることを知っている：

$.ajaxSetup({ 
    dataType: "script" 
}); 

$(function() { 
    $('a.remote').attach(Remote.Link); 
    $('form.remote').attach(Remote.Form); 
}); 

私がしなければならないのは、私のリンクにclass="remote"を追加し、私のフォームとすべてがうまくいく。 dataType: "script"の部分は、ページを正しく更新できるように、返された応答テキストにeval()があることを確認します。

したがって、私は新しい貨物を作る簡単なリンクを持っています。私のnew.js.rjsファイルでは、私は次のようにあります

page.insert_html :bottom, '#shipments_table', 
    :partial => 'test', :locals => { :shipment => @shipment } 

私はpage.visual_effect :fade, '#shipments_table'でこれを交換する場合、それはあなたが期待通りにことを行います。私の_test.html.erbファイルがかなりシンプルであれば、それも機能します。問題は私が部分的に<form>を追加しようとするときです。 <form>タグの配置によって異なる問題が発生します。たとえば、この

<tr> 
    <form> 
    <td>Some Text</td> 
    </form> 
</tr> 

この

<form> 
    <tr> 
    <td>Some Text</td> 
    </tr> 
</form> 

は絶対に何も表示されないことを確認します。この

<form></form> 
<tr> 
    <td>Some Text</td> 
</tr> 

は表示されますが、すべてのフォーマットが失われます。そして、これは

<tr> 
    <td>Some Text</td> 
</tr> 
<form></form> 

（視覚的に言えば）正しく動作します。しかし、明らかに欠点は、フォームの入力をテーブルの列に入れることができないということです。これにより、基本的にプロセス全体が役に立たなくなります。私はたぶん<div>のようなものの中にそれらを1行にまとめることでこれを回避することができますが、すべてを整列させることをお勧めします。

この難問を解決する方法のように任意のアイデアが大幅に

Answer 1

<form> :-)いただければ幸いにのみ<td>内部に配置されたか<table>をラップする必要があります。

<form><table/></form> 

Answer 2

あなたが使用しようとしている場合あなたがtomが言ったようにして、テーブル要素をフォーム要素で囲むか、またはtd要素の中に入れる必要があるでしょう。

別の方法としては、代わりにlabel要素をライニング物事アップのためにテーブルを放棄して使用することができます

<style type="text/css"> 
label{ 
    float: left; 
    width: 120px; 
    font-weight: bold; 
} 

input, textarea{ 
    width: 180px; 
    margin-bottom: 5px; 
} 

textarea{ 
    width: 250px; 
    height: 150px; 
} 

.boxes{ 
    width: 1em; 
} 

#submitbutton{ 
    margin-left: 120px; 
    margin-top: 5px; 
    width: 90px; 
} 

br{ 
    clear: left; 
} 
</style> 
<form> 
<label for="user">Name</label> 
<input type="text" name="user" id="user" value="" /><br /> 
</form> 

http://www.cssdrive.com/index.php/examples/exampleitem/tableless_forms/

Answer 3

それは、TR要素がちょうどフォーム子供とそれを期待していない可能性がありますブラウザが混乱しています。つまり、テーブルタグをフォームタグ内に配置すると、問題を解決するはずです。他のフォームが点在しているため、できない場合はtdの要素の代わりに入れ子にしてください。

最後の2つの例では、フォームとテーブルは親子ではなく兄弟であるため、1つに対して実行された遷移は、期待どおりに他のものに影響しない可能性があります。

まだ動作していない場合は、フォーム要素がドキュメントフローでどのように扱われるかと関係している可能性があります。 divに全体をラップして、そのトランジションを適用してみてください。