automizy-js-api

<div id='doc-container'> <h1>Module name</h1> <div class='description-label'>Description: <div class="description">Descr.</div> </div> <section> <h2 class='quick-nav'>Quick navigation <a href='#table/entry-examples'>Examples</a></h2> <table class='doc-content-table'> <tr> <td> <h3>Options</h3> <h4>Table options</h4> <ul> <li><a href='#table/option/border'>border</a></li> <li><a href='#table/option/borderCollapse'>borderCollapse</a></li> <li><a href='#table/option/cols'>cols</a></li> <li><a href='#table/option/exportable'>exportable</a></li> <li><a href='#table/option/inlineButtons'>inlineButtons</a></li> <li><a href='#table/option/loadingCellContent'>loadingCellContent</a></li> <li><a href='#table/option/openableInlineBox'>openableInlineBox</a></li> <li><a href='#table/option/page'>page</a></li> <li><a href='#table/option/pageMax'>pageMax</a></li> <li><a href='#table/option/perPage'>perPage</a></li> <li><a href='#table/option/perPageLabel'>perPageLabel</a></li> <li><a href='#table/option/perPageList'>perPageList</a></li> <li><a href='#table/option/rows'>rows</a></li> <li><a href='#table/option/searchValue'>searchValue</a></li> <li><a href='#table/option/selectable'>selectable</a></li> <li><a href='#table/option/storeData'>storeData</a></li> <li><a href='#table/option/tableButtons'>tableButtons</a></li> <li><a href='#table/option/title'>title</a></li> </ul> <h4>Column options</h4> <ul>  <li><a href='#table/option/colHtml'>html</a></li> <li><a href='#table/option/colText'>text</a></li> </ul> <h4>Global options</h4> <ul> <li><a href='#table/option/buttons'>buttons</a></li> <li><a href='#table/option/data'>data</a></li> <li><a href='#table/option/id'>id</a></li> <li><a href='#table/option/skin'>skin</a></li> </ul> </td> <td> <h3>Methods</h3> <h4>Table methods</h4> <ul> <li><a href='#table/method/addCols'>addCols</a></li> <li><a href='#table/method/addRows'>addRows</a></li> <li><a href='#table/method/deleteCol'>deleteCol</a></li> <li><a href='#table/method/deleteCols'>deleteCols</a></li> <li><a href='#table/method/deleteRow'>deleteRow</a></li> <li><a href='#table/method/deleteRows'>deleteRows</a></li> <li><a href='#table/method/getCell'>getCell</a></li> <li><a href='#table/method/getCells'>getCells</a></li> <li><a href='#table/method/$getCells'>$getCells</a></li> <li><a href='#table/method/getColByIndex'>getColByIndex</a></li> <li><a href='#table/method/getColByName'>getColByName</a></li> <li><a href='#table/method/getDomCells'>getDomCells</a></li> <li><a href='#table/method/getRowByIndex'>getRowByIndex</a></li> <li><a href='#table/method/getRowByRecordId'>getRowByRecordId</a></li> <li><a href='#table/method/loading'>loading</a></li> <li><a href='#table/method/openedId'>openedId</a></li> <li><a href='#table/method/openedRow'>openedRow</a></li> <li><a href='#table/method/rowCount'>rowCount</a></li> <li><a href='#table/method/selectedId'>selectedId</a></li> <li><a href='#table/method/selectedIds'>selectedIds</a></li> <li><a href='#table/method/selectedRow'>selectedRow</a></li> <li><a href='#table/method/selectedRows'>selectedRows</a></li> <li><a href='#table/method/setButtonsStatus'>setButtonsStatus</a></li> </ul> <h4>Row methods</h4> <ul> <li><a href='#table/method/rowCells'>cells</a></li> <li><a href='#table/method/row$cells'>$cells</a></li> <li><a href='#table/method/$checkbox'>$checkbox</a></li> <li><a href='#table/method/getCellByColName'>getCellByColName</a></li> <li><a href='#table/method/rowDomCells'>domCells</a></li> <li><a href='#table/method/rowIndex'>index</a></li> <li><a href='#table/method/rowRecordId'>recordId</a></li> </ul> <h4>Column methods</h4> <ul> <li><a href='#table/method/colCells'>cells</a></li> <li><a href='#table/method/col$cells'>$cells</a></li> <li><a href='#table/method/colDomCells'>domCells</a></li> <li><a href='#table/method/colIndex'>index</a></li> <li><a href='#table/method/colName'>name</a></li> </ul> <h4>Cell methods</h4> <ul> <li><a href='#table/method/col'>col</a></li> <li><a href='#table/method/cellHtml'>html</a></li> <li><a href='#table/method/index'>index</a></li> <li><a href='#table/method/recordId'>recordId</a></li> <li><a href='#table/method/row'>row</a></li> <li><a href='#table/method/cellText'>text</a></li> </ul> <h4>Global methods</h4> <ul> <li><a href='#table/method/table'>table</a></li> <li><a href='#table/method/addButton'>addButton</a></li> <li><a href='#table/method/draw'>draw</a></li> <li><a href='#table/method/drawTo'>drawTo</a></li> <li><a href='#table/method/hide'>hide</a></li> <li><a href='#table/method/remove'>remove</a></li> <li><a href='#table/method/removeButton'>removeButton</a></li> <li><a href='#table/method/show'>show</a></li> <li><a href='#table/method/widget'>widget</a></li> </ul> </td> <td> <h3>Events</h3> <h4>Table events</h4> <ul> <li><a href='#table/event/beforeOpenInlineBox'>beforeOpenInlineBox</a></li> <li><a href='#table/event/onExport'>onExport</a></li> <li><a href='#table/event/onHideCol'>onHideCol</a></li> <li><a href='#table/event/onPageFirst'>onPageFirst</a></li> <li><a href='#table/event/onPageLast'>onPageLast</a></li> <li><a href='#table/event/onPageNext'>onPageNext</a></li> <li><a href='#table/event/onPagePrev'>onPagePrev</a></li> <li><a href='#table/event/onPerPage'>onPerPage</a></li> <li><a href='#table/event/onShowCol'>onShowCol</a></li> <li><a href='#table/event/onSort'>onSort</a></li> </ul> <h4>Global events</h4> <ul> <li><a href='#table/event/create'>create</a></li> </ul> </td> </tr> </table> </section> <section> <h2>Options</h2> <h3>Table options</h3> <article id='table/option/border'> <h4 class='option-name'>border</h4> <div class='option-attributes'> Type:<div class='option-type'>String</div> </div> <div class='option-attributes'> Default value:<div class='option-default-value'>'none'</div> </div> <p class='option-use'> Use this function to set the border of the table using css parameters. </p> <div class='option-examples'>Code examples</div> Initialize the table widget with the <code>border</code><br> option specified, using object in constructor<br> <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], border: '1px solid #aaaaaa' //setting the border }).draw(); </pre> Initialize the table widget with the <code>border</code><br> option specified, using method chaining <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).border('1px solid #aaaaaa').draw(); //setting the border </pre> <br>Get or set the <code>border</code><br> option, after initialization<br> <pre class='prettyprint linenums'> var table = $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw(); //Setter table.border('1px solid #aaaaaa'); //returns table //Getter alert('border: '+table.border()); //returns value of border </pre> </article> <article id='table/option/borderCollapse'> <h4 class='option-name'>borderCollapse</h4> <div class='option-attributes'> Type:<div class='option-type'>Boolean</div> </div> <div class='option-attributes'> Default value:<div class='option-default-value'>true</div> </div> <p class='option-use'> Use this function to enable or disable border collapsing in the table. </p> <div class='option-examples'>Code examples</div> Initialize the table widget with the <code>borderCollapse</code><br> option specified, using object in constructor<br> <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], border: '1px solid #aaaaaa', borderCollapse: false //disabling borderCollapse }).draw(); </pre> Initialize the table widget with the <code>borderCollapse</code><br> option specified, using method chaining <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], border: '1px solid #aaaaaa' }).borderCollapse(false).draw(); </pre> <br>Get or set the <code>borderCollapse</code><br> option, after initialization<br> <pre class='prettyprint linenums'> var table=$A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], border: '1px solid #aaaaaa' }).draw(); //Setter table.borderCollapse(false); //returns table //Getter alert('borderCollapse: '+table.borderCollapse()); //returns value of borderCollapse </pre> </article> <article id='table/option/border'> <h4 class='option-name'>border</h4> <div class='option-attributes'> Type:<div class='option-type'>String</div> </div> <div class='option-attributes'> Default value:<div class='option-default-value'>'none'</div> </div> <p class='option-use'> Use this function to set the border of the table using css parameters. </p> <div class='option-examples'>Code examples</div> Initialize the table widget with the <code>border</code><br> option specified, using object in constructor<br> <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], border: '1px solid #aaaaaa' //setting the border }).draw(); </pre> Initialize the table widget with the <code>border</code><br> option specified, using method chaining <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).border('1px solid #aaaaaa').draw(); //setting the border </pre> <br>Get or set the <code>border</code><br> option, after initialization<br> <pre class='prettyprint linenums'> var table = $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw(); //Setter table.border('1px solid #aaaaaa'); //returns table //Getter alert('border: '+table.border()); //returns value of border </pre> </article> <article id='table/option/cols'> <h4 class='option-name'>cols</h4> <div class='option-attributes'> Type:<div class='option-type'>Array</div> </div> <div class='option-attributes'> Default value:<div class='option-default-value'>[]</div> </div> <p class='option-use'> Use this function to set the colums of the table.<br> If invoked without parameter returns the columns of the table, otherwise returns the table. </p> <div class='option-examples'>Code examples</div> Initialize the table widget with the <code>cols</code><br> option specified, using object in constructor<br> <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw(); </pre> Initialize the table widget with the <code>cols</code><br> option specified, using method chaining <pre class='prettyprint linenums'> $A.newTable().draw().cols([{name: 'name', text:'Campaign name'},{name: 'subject', text: 'Campaign subject'}]); </pre> <br>Get or set the <code>cols</code><br> option, after initialization<br> <pre class='prettyprint linenums'> var table=$A.newTable().draw(); //Setter table.cols([{name: 'name', text:'Campaign name'},{name: 'subject', text: 'Campaign subject'}]); //returns table //Getter table.cols(); //returns the cols array alert('cols: '+table.cols()); </pre> </article> <article id='table/option/exportable'> <h4 class='option-name'>exportable</h4> <div class='option-attributes'> Type:<div class='option-type'>Boolean</div> </div> <div class='option-attributes'> Default value:<div class='option-default-value'>false</div> </div> <p class='option-use'> If you set this option true, a little export icon wil appear next to the table. </p> <div class='option-examples'>Code examples</div> Initialize the table widget with the <code>exportable</code><br> option specified, using object in constructor<br> <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], exportable: true }).draw(); </pre> Initialize the table widget with the <code>exportable</code><br> option specified, using method chaining <pre class='prettyprint linenums'> $A.newTable().draw().cols([{name: 'name', text:'Campaign name'},{name: 'subject', text: 'Campaign subject'}]).exportable(true); </pre> <br>Get or set the <code>exportable</code><br> option, after initialization<br> <pre class='prettyprint linenums'> var table=$A.newTable().cols([{name: 'name', text:'Campaign name'},{name: 'subject', text: 'Campaign subject'}]).draw(); //Setter table.exportable(true); //returns table //Getter table.exportable(); //returns value of exportable alert('exportable: '+table.exportable()); </pre> </article> <article id='table/option/inlineButtons'> <h4 class='option-name'>inlineButtons</h4> <div class='option-attributes'> Type:<div class='option-type'>Boolean</div> </div> <div class='option-attributes'> Default value:<div class='option-default-value'>true</div> </div> <p class='option-use'> Use this function to set enable or disable the openable inline button box of the table. </p> <div class='option-examples'>Code examples</div> Initialize the table widget with the <code>inlineButtons</code><br> option specified, using object in constructor<br> <pre class='prettyprint linenums'> var table=$A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], rows:[ { recordId: 1, values:{ name: 'Campaign1', subject: 'test1' } } ], inlineButtons:[ {text: 'Edit'}, {text: 'Delete'} ] }).draw(); </pre> Initialize the table widget with the <code>inlineButtons</code><br> option specified, using method chaining <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], rows:[ { recordId: 1, values:{ name: 'Campaign1', subject: 'test1' } } ] }).draw().inlineButtons([{text: 'Edit'},{text: 'Delete'}]); </pre> <br>Get or set the <code>inlineButtons</code><br> option, after initialization<br> <pre class='prettyprint linenums'> var table=$A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], rows:[ { recordId: 1, values:{ name: 'Campaign1', subject: 'test1' } } ] }).draw(); //Setter table.inlineButtons([{text: 'Edit'},{text: 'Delete'}]); //returns table //Getter alert('inlineButtons '+table.inlineButtons()); // returns value of inlineButtons </pre> </article> <article id='table/method/loadingCellContent'> <h4 class='method-name'>loadingCellContent</h4> <div class='method-attributes'> Returns:<div class='method-returns'>Table || value</div> </div> <p class='method-use'>  </p> <div class='method-examples'>Code examples</div> <pre class='prettyprint linenums'> </pre> </article> <article id='table/option/loadingCellContent'> <h4 class='option-name'>loadingCellContent</h4> <div class='option-attributes'> Type:<div class='option-type'>String</div> </div> <div class='option-attributes'> Default value:<div class='option-default-value'>'<b>Loading...</b>'</div> </div> <p class='option-use'> Use this function to set the text you want to show while the cells are loading. </p> <div class='option-examples'>Code examples</div> Initialize the table widget with the <code>loadingCellContent</code><br> option specified, using object in constructor<br> <pre class='prettyprint linenums'> var table=$A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], loadingCellContent: '<b>Loading...</b>' }).draw().loading(); </pre> Initialize the table widget with the <code>loadingCellContent</code><br> option specified, using method chaining <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw().loadingCellContent('<b>Loading...</b>').loading(); </pre> <br>Get or set the <code>loadingCellContent</code><br> option, after initialization<br> <pre class='prettyprint linenums'> var table=$A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw().loading(); //Setter table.loadingCellContent('<b>Loading...</b>'); //returns table //Getter alert('loadingCellContent: '+table.loadingCellContent()); // returns value of loadingCellContent </pre> </article> <article id='table/option/page'> <h4 class='option-name'>page</h4> <div class='option-attributes'> Type:<div class='option-type'>Integer</div> </div> <div class='option-attributes'> Default value:<div class='option-default-value'>1</div> </div> <p class='option-use'> Use this function to set the number of the actual page showed in the right top corner. </p> <div class='option-examples'>Code examples</div> Initialize the table widget with the <code>page</code><br> option specified, using object in constructor<br> <pre class='prettyprint linenums'> var table=$A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], page: 2 }).draw(); </pre> Initialize the table widget with the <code>page</code><br> option specified, using method chaining <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw().page(2); </pre> <br>Get or set the <code>page</code><br> option, after initialization<br> <pre class='prettyprint linenums'> var table=$A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw(); //Setter table.page(2); //returns table //Getter alert('page: '+table.page()); // returns value of page </pre> </article> <article id='table/option/openableInlineBox'> <h4 class='option-name'>openableInlineBox</h4> <div class='option-attributes'> Type:<div class='option-type'>Boolean</div> </div> <div class='option-attributes'> Default value:<div class='option-default-value'>true</div> </div> <p class='option-use'> Use this function to set enable or disable the openable inline button box of the table. </p> <div class='option-examples'>Code examples</div> Initialize the table widget with the <code>openableInlineBox</code><br> option specified, using object in constructor<br> <pre class='prettyprint linenums'> var table=$A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], openableInlineBox: false }).draw(); </pre> Initialize the table widget with the <code>openableInlineBox</code><br> option specified, using method chaining <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw().openableInlineBox(false); </pre> <br>Get or set the <code>openableInlineBox</code><br> option, after initialization<br> <pre class='prettyprint linenums'> var table=$A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw(); //Setter table.openableInlineBox(false); //returns table //Getter alert('openableInlineBox: '+table.openableInlineBox()); // returns value of openableInlineBox </pre> </article> <article id='table/option/pageMax'> <h4 class='option-name'>pageMax</h4> <div class='option-attributes'> Type:<div class='option-type'>Integer</div> </div> <div class='option-attributes'> Default value:<div class='option-default-value'>1</div> </div> <p class='option-use'> Use this function to set the number of all pages showed in the right top corner. </p> <div class='option-examples'>Code examples</div> Initialize the table widget with the <code>pageMax</code><br> option specified, using object in constructor<br> <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], pageMax: 5 }).draw(); </pre> Initialize the table widget with the <code>pageMax</code><br> option specified, using method chaining <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw().pageMax(5); </pre> <br>Get or set the <code>pageMax</code><br> option, after initialization<br> <pre class='prettyprint linenums'> var table=$A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw(); //Setter table.pageMax(5) // returns table //Getter alert('pageMax: '+table.pageMax()); //returns value of pageMax </pre> </article> <article id='table/option/perPage'> <h4 class='option-name'>perPage</h4> <div class='option-attributes'> Type:<div class='option-type'>Integer</div> </div> <div class='option-attributes'> Default value:<div class='option-default-value'>10</div> </div> <p class='option-use'> Use this function to set the maximum number of rows appearon on a single page.<br> Only values from the perPageList are accepted. </p> <div class='option-examples'>Code examples</div> Initialize the table widget with the <code>perPage</code><br> option specified, using object in constructor<br> <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], perPage: 100 }).draw(); </pre> Initialize the table widget with the <code>perPage</code><br> option specified, using method chaining <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw().perPage(100); </pre> <br>Get or set the <code>perPage</code><br> option, after initialization<br> <pre class='prettyprint linenums'> var table=$A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw(); //Setter table.perPage(100); //returns table //Getter alert('perPage: '+table.perPage()); // returns value of perPage </pre> </article> <article id='table/option/perPageLabel'> <h4 class='option-name'>perPageLabel</h4> <div class='option-attributes'> Type:<div class='option-type'>String</div> </div> <div class='option-attributes'> Default value:<div class='option-default-value'>'Results per page'</div> </div> <p class='option-use'> Use this function to set the label next to the perPage selector. </p> <div class='option-examples'>Code examples</div> Initialize the table widget with the <code>perPageLabel</code><br> option specified, using object in constructor<br> <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], perPageLabel: 'Rows per page:' }).draw(); </pre> Initialize the table widget with the <code>perPageLabel</code><br> option specified, using method chaining <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw().perPageLabel('Rows per page'); </pre> <br>Get or set the <code>perPageLabel</code><br> option, after initialization<br> <pre class='prettyprint linenums'> var table = $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw(); //Setter table.perPageLabel('Rows per page'); //returns table //Getter alert('perPageLabel: '+table.perPageLabel()); //returns value of perPageLabel </pre> </article> <article id='table/option/perPageList'> <h4 class='option-name'>perPageList</h4> <div class='option-attributes'> Type:<div class='option-type'>Array</div> </div> <div class='option-attributes'> Default value:<div class='option-default-value'>[5, 10, 50, 100, 1000]</div> </div> <p class='option-use'> The array of numbers which will appear in hte perPage selector. </p> <div class='option-examples'>Code examples</div> Initialize the table widget with the <code>perPageList</code><br> option specified, using object in constructor<br> <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], perPageList: [1, 5, 10, 20, 25] }).draw(); </pre> Initialize the table widget with the <code>perPageList</code><br> option specified, using method chaining <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).perPageList([1, 5, 10, 20, 25]).draw(); </pre> <br>Get or set the <code>perPageList</code><br> option, after initialization<br> <pre class='prettyprint linenums'> var table=$A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw(); //Setter table.perPageList([1, 5, 10, 20, 25]); //returns table //Getter alert('perPageList: '+table.perPageList()); //return the array </pre> </article> <article id='table/option/rows'> <h4 class='option-name'>rows</h4> <div class='option-attributes'> Type:<div class='option-type'>Array</div> </div> <div class='option-attributes'> Default value:<div class='option-default-value'>[]</div> </div> <p class='option-use'> Use this function to set the rows of the table.<br> If invoked without parameter returns the rows of the table, otherwise returns the table. </p> <div class='option-examples'>Code examples</div> Initialize the table widget with the <code>rows</code><br> option specified, using object in constructor<br> <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], rows:[ { recordId: 1, // The id of the new row values:{ name: 'Campaign1', subject: 'test1' } }, { recordId: 2, values:{ name: 'Campaign2', subject: 'test2' } } ] }).draw(); </pre> Initialize the table widget with the <code>rows</code><br> option specified, using method chaining <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw().rows([{recordId:1, values:{name: 'Campaign1',subject: 'test1'}},{recordId:2, values:{name: 'Campaign2',subject: 'test2'}}]); </pre> <br>Get or set the <code>rows</code><br> option, after initialization<br> <pre class='prettyprint linenums'> var table=$A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw(); //Setter table.rows([{recordId:1, values:{name: 'Campaign1',subject: 'test1'}},{recordId:2, values:{name: 'Campaign2',subject: 'test2'}}]); //returns table //Getter table.rows(); //returns the cols array alert('rows: '+table.rows()); </pre> </article> <article id='table/option/selectable'> <h4 class='option-name'>selectable</h4> <div class='option-attributes'> Type:<div class='option-type'>Boolean</div> </div> <div class='option-attributes'> Default value:<div class='option-default-value'>false</div> </div> <p class='option-use'> Use this function to add checkboxes before the first column, which are used to select rows. </p> <div class='option-examples'>Code examples</div> Initialize the table widget with the <code>selectable</code><br> option specified, using object in constructor<br> <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], selectable: true }).draw(); </pre> Initialize the table widget with the <code>selectable</code><br> option specified, using method chaining <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw().selectable(true); </pre> <br>Get or set the <code>selectable</code><br> option, after initialization<br> <pre class='prettyprint linenums'> var table=$A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw(); //Setter table.selectable(true); //returns table //Getter alert('selectable: '+table.selectable()); //returns value of selectable </pre> </article> <article id='table/option/storeData'> <h4 class='option-name'>storeData</h4> <div class='option-attributes'> Type:<div class='option-type'>Boolean</div> </div> <div class='option-attributes'> Default value:<div class='option-default-value'>false</div> </div> <p class='option-use'> Use this option if you want to store the data of the cells. Next time you open the browser the table will remember the data. </p> <div class='option-examples'>Code examples</div> Initialize the table widget with the <code>storeData</code><br> option specified, using object in constructor<br> <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], storeData: true }).draw(); </pre> Initialize the table widget with the <code>storeData</code><br> option specified, using method chaining <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw().storeData(true); </pre> <br>Get or set the <code>storeData</code><br> option, after initialization<br> <pre class='prettyprint linenums'> var table=$A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw(); //Setter table.storeData(true); //returns table //Getter alert('storeData: '+table.storeData()); //returns value of storeData </pre> </article> <article id='table/option/searchValue'> <h4 class='option-name'>searchValue</h4> <div class='option-attributes'> Type:<div class='option-type'>String</div> </div> <div class='option-attributes'> Default value:<div class='option-default-value'>""</div> </div> <p class='option-use'> Use this function to set the string in the table search input. </p> <div class='option-examples'>Code examples</div> Initialize the table widget with the <code>searchValue</code><br> option specified, using object in constructor<br> <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], searchValue: 'Search this!' }).draw(); </pre> Initialize the table widget with the <code>selectable</code><br> option specified, using method chaining <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw().searchValue('Search this!'); </pre> <br>Get or set the <code>searchValue</code><br> option, after initialization<br> <pre class='prettyprint linenums'> var table=$A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw(); //Setter table.searchValue('Search this!'); //returns table //Getter alert('searchValue: '+table.searchValue()); //returns value of searchValue </pre> </article> <article id='table/option/tableButtons'> <h4 class='option-name'>tableButtons</h4> <div class='option-attributes'> Type:<div class='option-type'>Array</div> </div> <div class='option-attributes'> Default value:<div class='option-default-value'>[]</div> </div> <p class='option-use'> Use this option to set the array of buttons which appear above the table.<br> These buttons can have varios options, shown below in the examples. </p> <div class='option-examples'>Code examples</div> Initialize the table widget with the <code>tableButtons</code><br> option specified, using object in constructor<br> <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], rows:[ { values:{ name:'Campaign1', subject:'test' } }, { values:{ name:'Campaign2', subject:'test2' } } ], //You can set the table buttons by defining the buttons array in the constructor object buttons:[ { text: 'New campaign', skin: 'simple-orange' //Setting the automizy orange skin }, { text: 'Edit campaign', condition: 'select-one', //select-one condition makes the button clickable only if one row is selected disabled:true //the button will be disabled by default }, { text: 'Delete campaigns', condition: 'select-more-than-zero', //select-more-than-zero condition makes the button clickable if one or more rows are selected disabled:true //the button will be disabled by default } ], selectable: true //To use the conditions we have to make the table rows selectable }).draw(); </pre> Initialize the table widget with the <code>tableButtons</code><br> option specified, using method chaining <pre class='prettyprint linenums'> //You can also set the buttons after the table is initialized by using the tableButtons() method. $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], rows:[ { values:{ name:'Campaign1', subject:'test' } }, { values:{ name:'Campaign2', subject:'test2' } } ] }).tableButtons([ { text: 'New campaign', skin: 'simple-orange' //Setting the automizy orange skin }, { text: 'Edit campaign', condition: 'select-one', //select-one condition makes the button clickable only if one row is selected disabled:true //the button will be disabled by default }, { text: 'Delete campaigns', condition: 'select-more-than-zero', //select-more-than-zero condition makes the button clickable if one or more rows are selected disabled:true //the button will be disabled by default } ]).draw(); </pre> <br>Get or set the <code>tableButtons</code><br> option, after initialization<br> <pre class='prettyprint linenums'> var table = $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], rows:[ { values:{ name:'Campaign1', subject:'test' } }, { values:{ name:'Campaign2', subject:'test2' } } ] }); //Setter table.tableButtons([ { text: 'New campaign', skin: 'simple-orange' //Setting the automizy orange skin }, { text: 'Edit campaign', condition: 'select-one', //select-one condition makes the button clickable only if one row is selected disabled:true //the button will be disabled by default }, { text: 'Delete campaigns', condition: 'select-more-than-zero', //select-more-than-zero condition makes the button clickable if one or more rows are selected disabled:true //the button will be disabled by default } ]); //return table //Getter table.tableButtons(); //return the buttons array alert('tableButtons: '+JSON.stringify(table.tableButtons())); </pre> </article> <article id='table/option/title' class='last'> <h4 class='option-name'>title</h4> <div class='option-attributes'> Type:<div class='option-type'>String</div> </div> <div class='option-attributes'> Default value:<div class='option-default-value'>''</div> </div> <p class='option-use'> Use this option to set the title of the table. </p> <div class='option-examples'>Code examples</div> Initialize the table widget with the <code>title</code><br> option specified, using object in constructor<br> <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ], title: 'Newsletters' }).draw(); </pre> Initialize the table widget with the <code>title</code><br> option specified, using method chaining <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw().title('Newsletters'); </pre> <br>Get or set the <code>title</code><br> option, after initialization<br> <pre class='prettyprint linenums'> var table = $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, {name: 'subject', text: 'Campaign subject'} ] }).draw(); //Setter table.title('Newsletters'); //returns table //Getter alert('title: '+table.title()); //returns table </pre> </article> <h3>Column options</h3> <!-- <article id='table/option/active'> <h4 class='option-name'>active</h4> <div class='option-attributes'> Type:<div class='option-type'>Boolean</div> </div> <div class='option-attributes'> Default value:<div class='option-default-value'>true</div> </div> <p class='option-use'> Use this option to set a column visible or unvisible. </p> <div class='option-examples'>Code examples</div> Initialize the table widget with the <code>active</code><br> option specified, using object in constructor<br> <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, { name: 'subject', text: 'Campaign subject', active: false } ] }).draw(); </pre> Initialize the table widget with the <code>active</code><br> option specified, using method chaining <pre class='prettyprint linenums'> $A.newTable({ cols:[ {name: 'name', text:'Campaign name'}, { name: 'subject', text: 'Campaign subject', active: false } ] }).draw().getColByIndex(2).active(false); </pre> <br>Get or set the <