+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Create the Tag: | <cv-grid></cv-grid> |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Add the Search call (required): | <cv-grid on-search="search.getProducts"> |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Stop the initial load of data (optional, best for heavy queries so you | <cv-grid on-search="search.getProducts" no-initial-run> |
| | |
|have a chance to set it up first): | |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Add an Edit Url for the records (optional, activates the command column| <cv-grid edit-url="inventory:inventoryProductDetail({ID: [ID]})"> |
| | |
|if present): Admin, ID is injected | |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Storefront, ID is appended | <cv-grid detail-url="/Dashboard/Order/"> |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Add a deactivate call (optional, currently says delete, this REALLY |<cv-grid on-delete="search.deactivateProduct"> |
| | |
|needs to say deactivate instead 
): | |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Add Paging (optional, defaults to just get all data it can (based on |<cv-grid |
| | |
|filters, if any)): | // optional, defaults to false, can leave false and it |
| | |
| | // will use paging without showing the controls |
| | |
| | show-pager="true" |
| | |
| | // optional, providing only one page size hides it but |
| | |
| | // uses that size, defaults to the second size when more |
| | |
| | // than one (in this case 16) |
| | |
| | page-sizes="8,16,32,64,128" |
| | |
| | // optional, defaults to false |
| | |
| | server-paging="true" |
| | |
| | > |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Add a column (columns are required... duh): |<cv-grid> |
| | |
| | <cv-column /> |
| | |
| |</cv-grid> |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Set the field (optional, required for data-based columns): |<cv-column field="ID" /> |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Give it a custom title (optional, defaults to the field as a camel-case|<cv-column field="ID" title="#" /> |
| | |
|split, such as 'ProductKey' => 'Product Key', 'ID' would stay as | |
| | |
|'ID'): | |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Give it a specific width (optional, defaults to 100% divided by the |<cv-column field="ID" title="#" width="75px" /> |
| | |
|number of columns without a set width as a percentage): |OR |
| | |
| |<cv-column field="ID" title="#" width="5%" /> |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Hide a column (optional, column will be present for HTML/tracking use |<cv-column hidden field="ID" title="#" /> |
| | |
|but not visible to the user): | |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Make a column be a filter (optional, a textbox will be available to |<cv-column filter field="ID" title="#" /> |
| | |
|filter the data if no filter type is specified): | |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Make a column be an identifier filter (optional, textbox will be a |<cv-column filter field="ID" filter-type="id" /> |
| | |
|numeric up/down (aka spin box) instead): | |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Make a column be a Min/Max number filter (optional, textbox will be a |<cv-column filter field="Quantity" filter-type="minmaxnumber" /> |
| | |
|numeric up/down (aka spin box) for min instead with a '-' and then | |
| | |
|another NUD box for max): | |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Make a column be a Min/max number filter (optional, textbox will be a |<cv-column filter field="CreatedDate" filter-type="minmaxdate" /> |
| | |
|numeric up/down (aka spin box) for min instead with a '-' and then | |
| | |
|another NUD box for max): | |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Add a column to a sub-property (property of a property): |<cv-column field="Totals.Shipping" /> |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Add a static query parameter (optional, search call will always be |<cv-query-param field="StatusExclusion" value="Completed" /> |
| | |
|passed with this parameter): | |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Add an 'html select'-based Filter column: |<cv-column filter hidden field="TypeID" title="Type" filter-type="select"> |
| | |
| | <option value="" selected>Any</option> |
| | |
| | <option value="1">Web</option> |
| | |
| | <option value="2">Phone</option> |
| | |
| | <option value="3">On Site</option> |
| | |
| | <option value="4">Drop Ship</option> |
| | |
| |</cv-column> |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Add an 'html select'-based Filter column which is fed by server data: |<cv-column filter hidden field="TypeID" title="Type" filter-type="select" |
| | |
| | // parent.search.getProductTypes"> |
| | |
| | // Optional, adding this provides a null argument |
| | |
| | <option value="" selected>Any</option> |
| | |
| |</cv-column> |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Add a static parameter to the repeat call: |<cv-column hidden field="TypeID" title="Type" |
| | |
| |filter filter-type="select" |
| | |
| |on-option-repeat="$parent.search.getAttributeTypes"> |
| | |
| | <option-repeat-parameter value="2">TypeID</option-repeat-parameter> |
| | |
| | <option value="" selected>Any</option> |
| | |
| |</cv-column> |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Add a boolean column which creates checkboxes: |<cv-column field="IsVisible" title="Visible" width="30px" type="boolean" /> |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Make a column center the checkbox (or any content): |<cv-column field="IsVisible" cell-class="text-center" /> |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Make a column center the title: |<cv-column field="IsVisible" title="Visible" header-class="text-center" /> |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Give a column a format: |<cv-column field="ItemCount" format="{0:n0}" /> |
| | |
| |<cv-column field="Total" format="{0:c}" /> |
| | |
| |<cv-column field="Weight" format="{0:#,##0.00}" /> |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|Make a Date column: |<cv-column field="CreatedDate" title="Order Date" type="date" /> |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
| Add a custom column template: |<cv-column field="Totals.Total" |
| | |
| | title-key="ui.storefront.cart.Total" |
| | |
| | format="currency" cell-class="text-right" width="100px"> |
| | |
| | <cv-column-template> |
| | |
| | <script type="x-column-template"> |
| | |
| | <div ng-if="dataItem.StatusName == 'Partial Payment Received'" ng-bind="dataItem.BalanceDue | globalizedCurrency"></div> |
| | |
| | <div ng-if="dataItem.StatusName != 'Partial Payment Received'" ng-bind="dataItem.Totals.Total | globalizedCurrency"></div>|
| | |
| | </script> |
| | |
| | </cv-column-template> |
| | |
| | </cv-column> |
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+
|
|
|
+-----------------------------------------------------------------------+------------------------------------------------------------------------------------------------------------------------------------------------+