In first, sorry for my poor english ...

I use views to print statistics with table style. I'd like user can choose on the fly column displayed on table.
I have searched in forum, issues, google ... I found nothing !
I create one test function who do that with hook_views_pre_render. The function insert column select form in view header (with full html), it use javascript to change css display and it's work perfectly.
I'm not sure it's the best way. I maybe use hook_form_alter on views_exposed_form ? i need help to start in good condition ...

The function (just a test ...) :

function mymodule_views_pre_render($view) {
  //get column list
  $field_list = array();
  foreach($view->display['default']->display_options['fields'] as $key=>$value) {
    $field_list[$value['label']] = str_replace(array('_', ' '), '-', $key);
  }
  
  //create checkbox foreach column name
  foreach($field_list as $label=>$field){
    $header .= "<label><input onChange='hide_show_column(this)' type='checkbox' value='views-field-$field' checked/>$label ";
  }
  
  $header = "<fieldset><legend>Choose column</legend>$header</fieldset>";
  
  //javascript function to hide/show column
  $header .= "<script type='text/javascript'>
  				function hide_show_column(op){
  					if($('.'+op.value)[0].style.display == 'none') {
  						$('.'+op.value).css(\"display\",\"table-cell\");
  					}else{
	  					$('.'+op.value).css(\"display\",\"none\");
	  				}
  				}
  			   </script>";

  // 2 is my full html format
  $view->display['default']->handler->options['header_format'] = 2;
  
  //add form to header
  $view->display['default']->handler->options['header'] .= $header;
}

Comments

dawehner’s picture

dawehner
Primary language German
commented

If it works its fine.

But i wouldn't use inline js. I would move out the js to an extra js style, and by happy

esmerel’s picture

esmerel commented
Status: Active » Closed (fixed)

Solution suggested, no response.

dan.mantyla’s picture

dan.mantyla commented

Solution for D7

I needed the same thing, using Drupal 7.

Here's how I did it. It's very ugly, but gets the job done. I started with the code above, but a lot of it didn't work for me and I also needed to pre-select a few columns and hide the rest. I added this code to my custom module:

<?php
/**
 * Function: ias_views_pre_render
 * This just pretty much sets the "Generate Report" page to allow choosable columns.
 * Nothing is programmable by the GUI - it's all hard coded here...
*/
function ias_views_pre_render($view) {

  // --------------------------------
  // define how the view is displayed

  $view_name = 'search_computers';
  $pre_choosen = array("Title", "Post date", "Description");

  // --------------------------------

  if ($view->name == $view_name) {
    $choosable = true;
  }
  else {
    $choosable = false;
  }


  if ($choosable) {

    //get column list
    $field_list = array();
    foreach($view->display['default']->display_options['fields'] as $key=>$value) {
      $field_list[$value['label']] = str_replace(array('_', ' '), '-', $key);
    }

    $header='';

    //create checkbox foreach column name
    foreach($field_list as $label=>$field){
      if ($label != '') {
        $header.= "<label><input onClick='hide_show_column(this)' type='checkbox' value='views-field-$field' class='column_selector' name='$label' /> $label </label>\n";
      }
    }

    $header = "<fieldset><legend>Choose columns</legend>$header</fieldset>\n";
    $view->attachment_before .= $header;

    //javascript function to hide/show columns
    $script = "<script type='text/javascript'> preChoosen = new Array('" . join('\', \'', $pre_choosen) . "');";
    $script .= "
                                // init the checkboxes and columns
                                var selectors = document.getElementsByClassName('column_selector');
                                for(i in selectors) {
                                  //alert(selectors[i].value);
                                  var b = preChoosen.indexOf(selectors[i].name);
                                  if (b >= 0) {
                                    selectors[i].checked=true;
                                  } else {
                                    selectors[i].checked=false;
                                    try {
                                      var fields = document.getElementsByClassName(selectors[i].value);
                                      for (x in fields) {
                                        fields[x].style.display='none';
                                      }
                                    }
                                    catch(err) {
                                      //ignore
                                    }
                                  }
                                }

                                // toggle column visibility
                                function hide_show_column(selector){
                                    var fields = document.getElementsByClassName(selector.value);
                                    if (fields[0].style.display=='none') {
                                      for (x in fields) {
                                        fields[x].style.display='table-cell';
                                      }
                                    } else {
                                      for (x in fields) {
                                        fields[x].style.display='none';
                                      }
                                    }

                                }
                           </script>";
  $view->attachment_after .= $script;

  }
}
?>