Question

I have seen this railscast here

In that episode Ryan bates show data values. and creates a seperate class for sending the JSON data to the browser. I have done the same. However, instead of all get elements, I would like to add check boxes to my table as well. I have tried many different ways to do the same. However, check boxes donto appear in the datatable columns. What appears is just “true” or “false”values that corresposnd to the checkboxes.

I posted this question on the datatables forum but did not receive an answer that was very useful.

Here is my code for the class on the server side:

class ListingsDatatable
  delegate :params, :h, :link_to, :number_to_currency, to: :@view

  def initialize(view)
    @view = view
  end

  def as_json(options = {})
    {
      sEcho: params[:sEcho].to_i,
      iTotalRecords: Listing.count,
      iTotalDisplayRecords: listings.total_entries,
      aaData: data
    }
  end

private

  def data
    listings.map do |listing|
      [
        h(listing.id),
        link_to(listing.name, listing),
        h(listing.telephone),
        h(listing.fax),

        #This is the code I tried but no checkboxes, instead
        # if the following is included then no data shows in the table
        #check_box_tag('checked?', listing.checked),
        #check_box_tag('collected', listing.collected),
        #check_box_tag('digitized', listing.digitized),
        #check_box_tag('in db?', listing.in_database)

        #if I include the following, 
         #these are boolean values stored in the listings table
        #which generate "true" or "false" in the columns. This works to show the boolean    values. Checkboxes dont.   
        h(listing.keep),
        h(listing.checked),
        h(listing.collected),
        h(listing.digitized),
        h(listing.in_database)
      ]
    end
  end

  def listings
    @listings ||= fetch_listings
  end

  .........

Here is the index.html.erb file

<h3><%= link_to 'Click here to create a new Listing', new_listing_path %></h3>

<table id="listings" class="display" data-source="<%= listings_url(format: "json")%>">
<thead>
  <tr>
  <th>id</th>
  <th>name</th>
  <th>telephone</th>

  <th>Keep this listing?</th>
  <th>Checked</th>
  <th>Collected?</th>
  <th>Digitized?</th>
  <th>in DB?</th>
  </tr>
</thead>

<tbody>

</tbody>
</table>

<br />

Here is the Javascript file listings.js

//#JQuery

//Initialize the datatable
$(document).ready(function()
{
  var oTable = $('#listings').dataTable(
  {
    "sPaginationType":  "full_numbers",
    "bJQueryUI": true,
    "bSortClasses": false,
    "sScrollX": "90%",
    "bScrollCollapse": true,
    "sDom":  '<"top"iflp<"clear">>rt<"bottom"iflp<"clear">>',
    "bProcessing": true,
    "bServerSide": true,
    "sAjaxSource": $('#listings').data('source')
  });
});

Can someone please help me in understanding how can I get the check boxes to show up in those columns

Thanks a lot.

Answer 1

So I couldn’t figure a way of making this work with datatables.net. The documentation is vague. however, I realized that this may be by design since they offer datatables jquery as s free option but they have an editable datatable which is a commercial product. Since I couldn’t make this work, I chose to implement my own editable table in 4 hours. I no longer use datatables