0

RailsでJQueryを使用したことはありませんが、ボタンをクリックするとフォーム（現在は非表示になっている）が開くようにボタンをクリック可能にする必要があります-私が抱えている問題は、特にわからないのでレールで使用することですjqueryコードを含める方法と場所（これまでのところ、jQuery gemをインストールしました）

これは私の見解ではコードです：

    <td>
        <div class="file_description"><%= object.metadata['description']%> <button type="button" class="btn btn-default edit_description">Edit</button></div>
        <div class="file_description_update">
          <%= form_tag({:action => 'update_file_info'}, multipart: true) do %> 
            Update File Description: <%= text_area_tag :description %>
            <%= hidden_field_tag :s3_path, file %>  
            <%= hidden_field_tag :prefix, @prefix %>
            <%= submit_tag 'Submit' %> </td> <br />
          <% end %>
        </div>
      </td>

今、私は div.file_description_update クラスを非表示にしました

これは、jquery に使用できる可能性のあるコードです。

 var hiddenBox = $( "div.file_description_update" );
    $( "button.edit_description" ).on( "click", function( event ) {
    hiddenBox.show();
    });

この目的で使用している jquery が正しいかどうか、および Rails アプリ内のどこにどのように jquery コードを含めることができるか (どのファイルですか?) 教えてください。

++++++++++++++++++++++++++++++++++++++++++++++++++++ ++++++++++++++++++++++++++++++++++++++++

新しい質問を投稿する必要があるかどうかはわかりませんが、私が持っている jquery コードから、既存のコードを変更して、PER BUTTON ごとに非表示の div 要素が 1 つだけ表示されるようにする必要があります。対応するボタンごとに表示するフォームが 1 つだけ必要な場合、ボタンにすべての非表示のフォームが表示されます --- 追加の詳細を次に示します。

  1. HTMLコードは元の質問と同じです。

  2. これは、ボタンのクリックに使用する Jquery コードです。

$(document).ready(function(){ $( "button.edit_description" ).on( "click", function( event ) { $( "div.file_description_update" ).show(); }); });

  1. 質問として投稿したhtmlコード全体がループ内にあるため、「td」要素は、表形式で表示されるファイルごとに毎回生成され続けます---したがって、すべての非表示の表示に問題があります 'ボタンを 1 つだけクリックすると、テーブル内の td 要素が表示されます (対応するボタンの特定の非表示の 'td' 要素を表示するだけではありません)。

誰かが私を助けてくれれば本当に感謝しています。ありがとう！

4

1 に答える 1

0

コードは正しいですが、document.ready セクションに入れる必要があります。 

$(function () {
    $( "button.edit_description" ).on( "click", function( event ) {
      $( "div.file_description_update" ).show();
    }); 
)}

編集：この変数を使用する必要がある場合は、このドキュメントの準備ができているセクションの外に置いてください

于 2013-08-22T06:13:54.567 に答える