Server Features
ZingGrid has built-in parameters to connect to and query server REST endpoints.
Connecting
Use the <zg-param>
tag to enable connection to a server endpoint, like so:
<!-- define the main source for the API --> <zg-param name="src" value="https://swapi.py4e.com/api/people/"></zg-param> <!-- define the path in the JSON to get the array of results. In this case it is body.results --> <zg-param name="recordPath" value="results"></zg-param>
The API only returns ten results at a time, so you must implement server paging to properly connect to this endpoint.
Server Endpoint Connected Grid
Here is a complete grid that is connected to a server endpoint:
Top
Paging
Enable server paging through a couple <zg-param>
attributes, like so:
<zg-param name="loadByPage" value="true"></zg-param> <!-- define the "page" query parameter --> <zg-param name="pageKey" value="page"></zg-param> <!-- Need to tell ZG how many records were returned so it knows how to divide up the page-size --> <zg-param name="countPath" value="count"></zg-param> <!-- define the path in the result JSON to find next/prev urls --> <zg-param name="nextPath" value="next"></zg-param> <zg-param name="prevPath" value="previous"></zg-param>
Server Paging Enabled Grid
Here is a complete grid with server paging enabled:
Top
Search
Use the searchKey
param to enable server search, like so:
<zg-param name="searchKey" value="search"></zg-param>
Server Search Enabled Grid
Here is a complete grid with server search enabled:
Top
Related Resources
Here are some extra resources related to this feature to help with creating your grid:
[features: server features]