0

jquery 関数を使用してテーブル ヘッダー値を取得する際に問題が発生しています。ビュー ページに period_timing や weekdays などのテーブル形式が含まれている timetable module.in があります。

 days   09.00AM - 10.00AM   10.00Am-11.00AM  11.00AM-12.00PM  ........

 Mon         Assign             Assign           Assign

 Tues        Assign             Assign           Assign

 Wed         Assign             Assign           Assign

 ..

このテーブルでは、曜日は平日モデルに保存され、期間のタイミングは Period_timing モデルに保存されます。割り当てリンクをクリックすると、モーダル ウィンドウ (ポップアップ ウィンドウ) が表示されます。subject_id ラベルが含まれています。ドロップダウン リストからサブジェクトを選択できます。件名をポップアップ window.it に保存する際に、params で subject_id を送信します。しかし、weekday_id と Period_timing_id も必要です。だから、テーブルヘッダー値を取得するためにjqueryを試しました.period_timing idとweekday_idsを取得する正しい方法ですか.

また、コーディングも含めました。

コントローラー内

def timetable
     @timetable_entry =   TimetableEntry.new(params[:subject_id])

    if params[:course].present?
      @timetable = CoursePeriod.where(:course_id => params[:course])

      @view = @timetable.first.period_timings

      @week = WeekdayEntry.where(:status=> true).pluck(:weekday_id)
      @first_day  = Weekday.find(@week[0]).day
      @second_day = Weekday.find(@week[1]).day
      @third_day  = Weekday.find(@week[2]).day
      @fourth_day = Weekday.find(@week[3]).day
      @fifth_day  = Weekday.find(@week[4]).day
      render :partial => "table"

  end
end



 def subject_entry  
  #raise params.inspect      
    TimetableEntry.create(:subject_id => params[:timetable_entry][:subject_id])
  end

ビュー内 _table.html.erb

<table cellpadding="0" cellspacing="0" border="0" class="table table-striped table-bordered">
    <thead>
            <th>&nbsp;&nbsp;&nbsp;&nbsp;Days &nbsp;&nbsp;&nbsp;</th>
            <% @view.each do |i| %> 
            <th><%=i.start_time.strftime("%I:%M %p") %>--<%= i.end_time.strftime("%I:%M %p") %></th>
               <% end %>         
    </thead>
         <tbody>
                <tr>
                  <td><%= @first_day %></td>
                   <% (1..@view.count).each do |j|%>

                   <td><%= link_to "Assign","#myModal", :class => "assign", "data-toggle" => "modal" %>
                <div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                  <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                     <h3 id="myModalLabel">Timetable Entries</h3>
                  </div>

                  <div class="modal-body">
                    <%= form_for (@timetable_entry),url: subject_entry_path, method: :get do |f| %>
                    <%= f.label :subject_id %>

                    <%= f.select :subject_id, options_from_collection_for_select(Subject.all,"id", "name"),class: "display_mark",:prompt => "--Select--" %>
                    <%= f.submit "Create" %>
                    <% end %>
                  </div>

                  <div class="modal-footer">
                    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
                    <button class="btn btn-primary">Save changes</button>
                  </div>

                </div>

               </td>
                  <% end %>
                </tr>
                <tr>
                   <td><%= @second_day %></td>
                     <% (1..@view.count).each do |j|%>
                     <td><%= link_to "Assign", "#myModal", :class => "", "data-toggle" => "modal" %></td>
                  <% end %>
                </tr>
                <tr>
                   <td><%= @third_day %></td>
                   <% (1..@view.count).each do |j|%>
                   <td><%= link_to "Assign", "#myModal", :class => "", "data-toggle" => "modal" %></td>
                  <% end %>
                </tr>
                <tr>
                   <td><%= @fourth_day %></td>
                   <% (1..@view.count).each do |j|%>
                   <td><%= link_to "Assign", "#myModal", :class => "", "data-toggle" => "modal" %></td>
                  <% end %>
                </tr>
                <tr>
                   <td><%= @fifth_day %></td>
                   <% (1..@view.count).each do |j|%>
                   <td><%= link_to "Assign", "#myModal", :class => "", "data-toggle" => "modal" %></td>
                  <% end %>
                </tr>
        </tbody>      

</table>

そして、テーブルヘッダー値を取得するためにjqueryを試しました。しかし、これは Days テキストを示しています。

$("body").on('click', '.assign', function(){
    var col = $(this).prevAll().length;
  var headerObj = $(this).parents('table').find('th').eq(col);
   // A quick test!
  alert("My cell header is called: " + headerObj.text());
});

あなたのアイデアを共有してください

4

2 に答える 2

1

以下のコードを試して、それぞれの列ヘッダーを取得してください。

$("body").on('click', '.assign', function(){
  var headerObj = $(this).parents('table').find('th').eq($(this).index());
   // A quick test!
  alert("My cell header is called: " + headerObj.text());
});

月曜日、火曜日などの日の値を取得するには、以下のコードを試してください。

$("body").on('click', '.assign', function(){
    var headerObj = $(this).siblings('td:first-child');
   // A quick test!
  alert(headerObj.text());
});

注: DOM で高すぎる$(document)代わりに使用できます。$("body")

于 2013-09-18T05:01:12.120 に答える
0

var headerObj = $(this).parents('table').find('thead').find('th').eq(col); を試してください。

于 2013-09-18T04:57:13.123 に答える