Rendering an html table with ajax, JQuery, and render :partial

Here is my question. I want to create a table with a specific header row that looks like this

<table>
<tr class="table-header"> <th></th><th> Name </th><th> Location </th></tr>
..data..

</table>

The problem comes when i want to do an ajax populate of the table rows. I have tried a couple options. Basically my app knows where to insert the data using a selector like #table-data. It will update fine, but overwrite the table header, or insert it all in one column, or put it above the header etc. I have tried doing it with a div, <p>, <tr> etc. but it never seems to work out right.

My action looks like this:

def multi_search

     @profiles = Profile.find(:all) do
           first_name =~ "%#{params[:profile][:first_name]}%" if params[:profile][:first_name].present?
           last_name  =~ "%#{params[:profile][:last_name]}%" if params[:profile][:last_name].present?
           city  =~ "%#{params[:profile][:city]}%" if params[:profile][:city].present?
           state  =~ "%#{params[:profile][:state]}%" if params[:profile][:state].present?                
           type      =~  "%#{params[:profile][:type]}%"      
           paginate :page => params[:page], :per_page => params[:rows]      
           order_by "#{params[:sidx]} #{params[:sord]}"
       end

      render :partial=> "search/search_results", :collection => @profiles, :as=>:profile  
   end 

and my javascript looks like this:

$("#ajax_search_form").ajaxForm({target: '#provider_search_results'})

and my partial looks like this:

<tr>
 <td class="table_user_image"><%= image_tag profile.avatar.url(:small) %></td>
 <td class="table_user_name">
  <%= link_to_if(profile.user.role=="Provider", profile.full_name, { :controller => "profiles", :action => "show_public_provider",    :id=>profile.id}) do
       link_to(profile.full_name, { :controller => "profiles", :action => "show_public_student", :id => profile.id })
     end %></td>
 <td class="table_user_location"> <%= profile.city %>, <%= profile.state %> </td>

</tr>

In any case, I 开发者_如何学JAVAguess I need to render some static text before I get to the collection, and I'm not sure how to do it. Any help would be much appreciated.

NOTE: I am using jrails

With the .ajaxForm() call you can handle the response yourself. Instead of using the target option you will have to handle the response by specifying a success option with a function that would do the following:

• Remove everything but your header row (similar to this question) $("#MyTable tr:not(.table-header)").remove()
• Append the successful response to the table in question. $("#MyTable").append(response)

The other option would be to render a partial that contains your header row and also renders your original partial with your collection. A partial that renders another partial.