Search function not working in footable when rendering partial form in rails 4

Question

I am using footable .But search functionality not working when rendering form and I included file below.

Controller

  def leave_summary
    if params[:summary].present?
       @leave_summary = LeaveTaken.where(:teacher_id => params[:summary])
       render :partial => "leave_detail"
    end
  end      

View (leave_summary.html.erb)

        <i class='icon-list'> Leave Summary</i>
      <% end %>
    </li> <% content_for :sidebar do %>
  <ul class="nav nav-tabs nav-stacked">
    <li>
      <%= link_to "Leave management", "#", {class: 'text-center', style: "background-color:#c4c4c4;" } %>
    </li>
    <li>
      <%= link_to new_leave_type_path do %>
        <i class='icon-list'> Add Leave Type</i>
      <% end %>
    </li>
    <li>
      <%= link_to new_leave_apply_path do %>
        <i class='icon-list'> Apply Leave</i>
      <% end %>
    </li>
    <li>
      <%= link_to leave_applies_path do %>
        <i class='icon-list'> Leave Approval</i>
      <% end %>
    </li>
    <li>
      <%= link_to leave_summary_path do %>
    <li>
      <%= link_to my_leave_path do %>
        <i class='icon-list'> My Leave</i>
      <% end %>
    </li>   
  </ul>    
<% end %>

<div class='row-fluid clear'>
  <div class='box gradient'>
    <div class='title'>
      <h3 style='margin-left:1em'>My Leave</h3>
    </div>
    <div class='content'>
        <div class="control-group string optional student_gender">
    <label class="string optional control-label" for="student_gender">Teacher Code</label>
    <div class="controls">
   <%= select_tag "leaves", options_from_collection_for_select(Teacher.all, "id", "teacher_code"), :prompt => "--Select Employee No--" %>
   </div>
   </div>

 <div id = "leaves_apply">

 </div>
    </div>
  </div>
</div>                   

_leave_detail.html.erb

<p class='pull-right'>
  Search: <input id="filter" type="text">
</p>
<table class='footable' data-page-navigation=".pagination" data-filter="#filter" data-page-size="10" data-page-previous-text="prev" data-page-next-text="next">
    <thead>
        <tr class ="info">

            <th>Leave Type</th>
            <th>Leave Entitled</th>
      <th>Leave Taken</th>
      <th>Balance</th>
    </tr>
</thead>
    <tbody>
              <% @leave_summary.each do |i| %>
                    <tr class = "info">
                        <td><%= i.leave_type.leave_name %></td>
                        <td><%= i.leave_type.leave_count %></td>
                        <td><%= i.leave_type.leave_count - i.leave_balance %></td>
                        <td><%= i.leave_balance.to_i %></td>            
                </tr>
            <% end %>   
        </tbody>
</table>

Here Fotable search is not working.

Answer 1

You need to initialize FooTable in _leave_detail.html.erb

<table class='my_footable' data-page-navigation=".pagination" data-filter="#filter" ...>
  ...
</table>

<!-- don't forget to initialize after </table>-tag -->
<script type="text/javascript">
    $('.my_footable').footable();
</script>

Please pay attention to match in <table class='my_footable'> and $('.my_footable').footable()

UPD: Just finished wrapping FooTable V2 branch in FooTable-rails. Just add to your Gemfile:

gem 'footable-rails', '~> 0.0.2', git: 'https://github.com/olegkurchin/FooTable-rails'

Then run in root folder

$ gem uninstall footable-rails
$ bundle install

and restart Rails server