Skip to content

Save Columns Selected in Column Chooser

The following code snippet will open column chooser dialog window on page load. When the user clicks "OK", it then saves any "visible" columns and Ajax posts to server side. User would need to provide their own server side script to process whatever columns were chosen. 

<?php
$dg = new C_DataGrid("select * from products", "productCode", "products");
$dg->enable_columnchooser(true);
$dg -> display();
?>

<script>
$(function($){
  jQuery("#products").jqGrid('columnChooser', {
    done : function (perm) {
      if (perm) {
          // "OK" button are clicked          
          cols = $('#products').jqGrid('getGridParam', "colModel");
          colChosen = [];
          for (i = 0; i < cols.length; i++) {
            if(!cols[i]['hidden']){
              colChosen.push(cols[i]);
            }
          }

          $.ajax({
              url: 'http://example.com/save_column_chosen.php',
              data: {selectedCols: colChosen},
              type: 'POST',
              dataType: 'JSON'
        });

      } else {
          // we can do some action in case of "Cancel" button clicked
      }
    }
  });
 
})
</script>

Feedback and Knowledge Base