Skip to content

1.13 Help instructions

Jump to bottom Edit New page
koalyptus edited this page May 14, 2020 · 7 revisions

Container displaying help instructions.

Property Type Description Remarks Example
help_instructions boolean|object

enables / disables question mark visibility showing help container element (default - undefined)

 Note that the help feature is generated automatically unless you set this property to false 
var tfConfig = { help_instructions: true };
// or
var tfConfig = { 
  help_instructions: {} 
};
target_id string defines the id of the element containing the instructions button (?) (default - null) By default the ? is generated in the top toolbar 
var tfConfig = { 
  help_instructions: {
    target_id: 'myContainerId'
  } 
};
container_target_id string defines the id of the container element for instructions content (default - null) 
var tfConfig = { 
  help_instructions: {
    container_target_id: 'myContainerId'
  } 
};
text string sets the help/instructions text (default - 'Use the filters above each column to filter and limit table data.') 
var tfConfig = { 
  help_instructions: {
    text: 'My Help text here...'
  } 
};
html string sets the help/instructions HTML (default - null) 
var tfConfig = { 
  help_instructions: {
    html: '
My Help text here...
Hello world!
'
  } 
};
btn_text string sets the help/instructions button text (default - '?') 
var tfConfig = { 
  help_instructions: {
    btn_text: 'Help'
  } 
};
btn_html string sets the help/instructions button HTML (default - '?') Note that the onclick event is added by default to the html element and overwrites any eventual onclick attribute 
var tfConfig = { 
  help_instructions: {
    btn_html: 'Help'
  } 
};
btn_css_class string defines the css class of the help/instructions button (default - 'helpBtn') 
var tfConfig = { 
  help_instructions: {
    btn_css_class: 'myCssClass'
  } 
};
container_css_class string defines the css class of the help/instructions container (default - 'helpCont') 
var tfConfig = { 
  help_instructions: {
    container_css_class: 'myCssClass'
  } 
};
toolbar_position string defines where it will be placed inside the toolbar (default - 'right') 3 possible values: 'left', 'center' and 'right' 
var tfConfig = { 
  help_instructions: {
      toolbar_position: 'center'
  } 
};
container_adjust_left_position number adjusts container left position when table's horizontal scroll is on, typically when `responsive` option is enabled (default - 25) 
var tfConfig = { 
  help_instructions: {
      container_adjust_left_position: 50
  } 
};

Website | Examples | Es6 documentation

Clone this wiki locally