deblan-mirror/TableFilter
1
0
Fork 0
mirror of https://github.com/koalyptus/TableFilter.git synced 2024-05-03 07:03:33 +02:00
Code Issues Releases Wiki Activity
Page: 1.03 Grid layout
Pages
1.0 Configuration 1.01 Appearance 1.02 Main features 1.03 Grid layout 1.04 Paging 1.05 Drop down filter 1.06 Checklist filter 1.07 Rows counter 1.08 Loading indicator 1.09 Submit and reset button 1.10 Status bar 1.11 Data types 1.12 Themes 1.13 Help instructions 1.14 Popup filters 1.15 No results message 1.16 Highlight keywords 1.17 State 1.18 Mark active columns 1.19 Toolbar 1.20 Single filter 2.0 TableFilter class 2.1 Public properties 2.2 Public methods 3.0 Extensions 3.1 Advanced grid 3.1 Sort 3.2 Column operations 3.3 Filters visibility 3.4 Columns visibility 4. Filter operators Home Obsolete TODO
5 1.03 Grid layout
koalyptus edited this page 2018-09-21 18:44:17 +10:00
Property Type Description Remarks Example
grid_layout boolean|object enables / disables grid layout generation (default - false)   
var tfConfig = { grid_layout: true };
// or
var tfConfig = { 
  grid_layout: {} 
};
width string this property defines the width of the main container of the grid (default - null)   
var tfConfig = { 
  grid_layout: {
    width: '850px'
  } 
};
height string this property defines the height of the main container of the grid (default - null)   
var tfConfig = { 
  grid_layout: {
    height: '400px'
  } 
};
cont_css_class string defines the css class of the main container of the grid (default * 'grd_Cont')

this div contains the whole grid which comprises:

  • a top div containing the headers' table
  • a middle div containing the data table
  • a bottom div containg the paging elements
 
var tfConfig = { 
  grid_layout: {
    cont_css_class: 'myclass'
  } 
};
tbl_cont_css_class string defines the css class of the container of the data table (default * 'grd_tblCont')   
var tfConfig = { 
  grid_layout: {
    tbl_cont_css_class: 'myclass'
  } 
};
tbl_head_css_class string defines the css class of the container of the headers' table (default * 'grd_headTblCont')   
var tfConfig = { 
  grid_layout: {
    tbl_head_css_class: 'myclass'
  } 
};
inf_grid_css_class string defines the css class of the bottom div containing the paging elements (default - 'grd_inf')   
var tfConfig = { 
  grid_layout: {
    inf_grid_css_class: 'myclass'
  } 
};
filters boolean enables/disables the filters generation (default - true)   
var tfConfig = { 
  grid_layout: {
    filters: false
  } 
};
default_col_width string defines the default column width if no width is defined (default * '100px')   
var tfConfig = { 
  grid_layout: {
    default_col_width: '125px'
  } 
};
no_headers boolean instructs the component that current working table has no headers (default - false)   
var tfConfig = { 
  grid_layout: {
    no_headers: true
  } 
};

Website | Examples | Es6 documentation