Highlighting Selected Row

Highlighting Selected Row

jdadwilsonjdadwilson Posts: 127Questions: 30Answers: 1

I just started the process of converting the Admin area of my site from dataTables to DataTables. Everything seems to work fine except for one thing. When I select a row it does not highlight. Here is the initialization of the table...

// Initialize the dataTable
oTable = $('#adminTable').DataTable( {

    ajaxSource: 'files_ajax/ajax_Announcements.php',

    columns: [
        { data: 'min_heading',      className: 'udatal', orderable: true,  visible: true },
        { data: 'win_type',         className: 'udatal', orderable: true,  visible: true },
        { data: 'win_beg_datetime', className: 'udatac', orderable: true,  visible: true },
        { data: 'win_end_datetime', className: 'udatac', orderable: true,  visible: true },
        { data: 'win_id',           className: 'udatal', orderable: false, visible: false }
    ], // End of aoColumns

    dom: 'A<"top"lf>rt<"bottom"pi><"clear">',

    language: { 'paginate': { 'previous': 'Prev' } },
    lengthMenu: [15, 30, 60],

    order: [],

    paging: true,
    pagingType: 'full_numbers',

    select: { style: 'single' },

    initComplete: function() {
        this.api().alphabetSearch.recalc();
        // Hide info areas if total records is less than 'length' number of rows
        var wrapper = this.parent();
        var tableInfo = oTable.page.info();
        if ( tableInfo.recordsTotal <= tableInfo.length ) {
            $('#myAlphabet').hide();
            $('.adminTable_paginate', wrapper).hide();
            $('.adminTable_filter', wrapper).hide();
            $('.adminTable_info', wrapper).hide();
            $('.adminTable_length', wrapper).hide();
        }
    } // End of fnInitComplete 
}); // End of dataTable

According to the documentation the 'select' parameter should highlight each row as selected and remove the highlighting for other rows. This is the way dataTables worked.

TIA for any assistance
jdadwilson

Answers

  • jr42.gordonjr42.gordon Posts: 305Questions: 2Answers: 49

    Have you seen this example?

  • jdadwilsonjdadwilson Posts: 127Questions: 30Answers: 1

    Thanks for your response.

    The referenced example does not answer the issue. The example only relates to rollover action which I have provided for but does not address my desire. Maybe I was not specific enough in my description of the issue/desire.

    My desire is that when a row is selected the high-light of the row would continue after the click (e.g., selection). The selection causes information from the ajax/json to populate a form for editing. Yes, I know the record could be edited in the table but some forms/tables contain 15-20 fields (some of which are structured as longtext).

    I would love to provide a link to an example but unfortunately the situation comes from within the site admin area and the customer has very strict rules about access.

    jdadwilson

  • allanallan Posts: 63,552Questions: 1Answers: 10,477 Site admin

    I'm afraid I'm still not getting it :-). From your original post I would suggest that the Select CSS hasn't been loaded. This example shows how Select should work.

    But your second post suggest you might be replacing the row, or some other kind of reload is going on? I'm not quite getting it (although it is late at night :-) ).

    Allan

This discussion has been closed.