Hiding Dynamic Columns

Hiding Dynamic Columns

ASheppardWorkASheppardWork Posts: 7Questions: 1Answers: 0
edited May 2014 in DataTables 1.10

I am able to use DataTables on my site. We are using JSON as the returned format from a AJAX data source. We have to use server-side processing for the amount of data we are returning(19k rows and 28 columns).

I can loop through the list of column names and get results. However, when I try to put one of the columns as "null" so it does not show up, the whole script fails and I only get column headers.

I assistance to hide the COMPETITORGUID column.

this works, but always shows the COMPETITORGUID column:

<cfset listColumns =
"COMPETITORGUID,COMPETITOR_ID,PARENT_ID,COMPETITOR,WEBSITE,CORE_MARKET,
HEADQUARTERS,ADDRESS1,ADDRESS2,ADDRESS3,CITY,STATE,ZIP,REGIONNUMBER,
REGIONNAME,LINEPIPE,PIPE,VALVES,FITTINGS,FLANGES,AUTOMATION,OCTG,
GAS_PRODUCTS,WORK_DATE,GROUP_WITHIN_COMPANY,LASTCHANGEDATE,
LASTCHANGEUSER,LATITUDE,LONGITUDE" />
        


 $('#theCompetitors').dataTable({
                "bJQueryUI": true,
                "sPaginationType": "full_numbers",
                "bProcessing": true,
                "bServerSide": true,
                "sAjaxSource": "/cfc/main.cfc?method=getCompetitorsJSON",
                "aaSorting": [],
                "iDisplayLength": 10,
                "aLengthMenu": [[10, 25, 50, 100], [10, 25, 50, 100]],
                "aoColumns": [
                                       
                    <cfloop list="#listColumns#" index="myColumn">
                        <cfoutput> { "mData": "#myColumn#" }<cfif myColumn NEQ listlast(listColumns)>,</cfif></cfoutput>
                    </cfloop>
                    
                                ]          
                
                                    })

this does not work; it only displays the column headers without DataTables formatting:

<cfloop list="#listColumns#" index="myColumn">
          <cfoutput>
             <cfif  "myColumn" EQ 'COMPETITORGUID' >null 
                <cfelseif myColumn EQ listlast(listColumns)> { "mData": "#myColumn#" }
                <cfelse>,
              </cfif>
           </cfoutput>
 </cfloop>

Listing out the columns 1 by 1 does not return data; and gives the error that vairable "#[column]#" is not defined.

{ "mData": "#COMPETITORGUID#" },

Also using the aoColumns list of the following does not return data either:

{ type: "text" },  
{ type: "text" }, 

This question has an accepted answers - jump to answer

Answers

  • tangerinetangerine Posts: 3,348Questions: 36Answers: 394

    Are you saying you want a hidden column?

    http://datatables.net/examples/basic_init/hidden_columns.html

  • ASheppardWorkASheppardWork Posts: 7Questions: 1Answers: 0

    @Tangerine Yes, I want to hide the COMPETITORGUID column, however, the if statements are not picking up on my test; I saw that page and would use it if I could get the if statement to behave. Or I've gotten something syntactically wrong. On a side note, I am passing in the values from a .cfc that builds the JSON file. I am now trying to remove the column from the JSON side so it never gets into the datafeed in the first place.

  • tangerinetangerine Posts: 3,348Questions: 36Answers: 394
    edited May 2014 Answer ✓

    Well, yes - if you don't actually need the data, just don't retrieve it.

    But you shouldn't need any conditional (if) test, just define the relevant column as shown in the example.

          "columnDefs": [ 
                 {
                    "targets": [your_column_index],
                    "visible": false,
                    "searchable": false
                },
    
    
  • ASheppardWorkASheppardWork Posts: 7Questions: 1Answers: 0
    edited May 2014

    It turns out, I need the data, so I can't filter it out of the JSON. I tried the example like this:

    <script type="text/javascript">
         $(document).ready(function() {
    
         $('#theCompetitors').dataTable({
            "columnDefs": [
                   {
                        "targets": [1],
                         "visible": false,
                         "searchable": false
                               }],
                 "bJQueryUI": true,
                 "sPaginationType": "full_numbers",
                 "bProcessing": true,
                 "bServerSide": true,
                 "sAjaxSource": "/maps/cfc/main.cfc?method=getCompetitorsJSON",
                 "aaSorting": [],
                 "iDisplayLength": 10,
                 "aLengthMenu": [[10, 25, 50, 100], [10, 25, 50, 100]],
                 "aoColumns": [
                                      
      <cfloop list="#listColumns#" index="myColumn">
         <cfoutput> { "mData": "#myColumn#" }<cfif myColumn NEQ listlast(listColumns)>,</cfif></cfoutput>
       </cfloop> 
                                   ]
                    
                    })
    
    

    The column still shows up.

  • ASheppardWorkASheppardWork Posts: 7Questions: 1Answers: 0

    I also tried "targets":[0] in case the indexing started at 0. None of the columns disappear no matter what index number is used.

  • ASheppardWorkASheppardWork Posts: 7Questions: 1Answers: 0

    I just looked at our version of DataTables again, and noticed that it is version 1.9.0, not 1.10 like I was told. Would this be a potential cause?

  • ASheppardWorkASheppardWork Posts: 7Questions: 1Answers: 0

    And our version of columnFilter is 1.5.6

  • ASheppardWorkASheppardWork Posts: 7Questions: 1Answers: 0

    I feel like a big dummy!

    I got it to work with this syntax:
    oTable.fnSetColumnVis( 0, false);

    all from:
    Class: DataTables- documentation

    It was the version being 1.9.0 that was the problem.

    Thank you @Tangerine, if I was using the proper version; I wouldn't have any problems.

    arg.

  • allanallan Posts: 61,665Questions: 1Answers: 10,096 Site admin

    Good to hear you got it working!

    Allan

This discussion has been closed.