Building Apps with Jigx
Data
Offline remote data handling
15min
dealing with offline remote data is fundamental to ensuring data synchronization and consistency between the mobile app and the remote data source, allowing users to continue using the app and performing actions without interruption queue operations provide the functionality needed when the device regains network connectivity and manages a sequence of elements in a specific order the commands in the queue can be manipulated to reduce the number of calls to the remote data store what happens to data when you are offline? data capture offline when the mobile app is offline, any actions that require remote data interaction, such as submitting a form, uploading a file, or syncing data, are queued each action is captured and stored in a queue in the local data provider on the device network monitoring the app monitors the network status it triggers the dequeuing process when it detects that the device has regained connectivity dequeue and sync the app starts processing the commands in the queue it dequeues each command and attempts to send it to the remote server if the operation is successful, the app removes the command from the queue how to configure the queue in the execute entity docid\ jgwlsfzaop6u6mph6u5to , execute entities docid 9lgxfp6tosgpfj6p44n0x , and submit form docid\ ktnlfvufq qnthlojcvd actions, the queueoperation property is configured to determine how the record must be handled in the queue when the device is offline there are two configuration options property description replace all queued commands for the specified record and method type are replaced with the current action for example, a record is created and then updated a few times using replace for the update method results in only two commands in the queue for the record create and update if replace is not used, there will be a command for every action create, update, update, update replace is recommended for backend systems with rate limits the queueoperation replace requires an id (must be in lowercase) this can either be configured in the functionparameter of the execute entity action with an id configured in the parameters of the function file data property in the execute entity action add all commands are added to the queue when the queueoperation property is omitted, the default is add execute entity replace actions \ children \ type action execute entity options title update customer provider data provider rest entity customers method update \# use replace to ensure you only have one update on the queue related to a record \# not adding the replace will not break the solution but will help to avoid chattiness and \# scenarios where backends have rate limits queueoperation replace function rest update customer functionparameters \# id is a required property for the replace queue id =@ctx jig inputs customer id firstname =@ctx components firstname state value lastname =@ctx components lastname state value companyname =@ctx components companyname state value address =@ctx components address state value city =@ctx components city state value email =$lowercase(@ctx components email state value) execute entity add actions \ children \ type action execute entity options title update customer provider data provider rest entity customers method update \# using add will add a command for every update to the queue related to a record \# using add can be cumbersome and costly for scenarios where backends have rate limits queueoperation add goback previous function rest update customer functionparameters \# id is a required property for the replace queue id =@ctx jig inputs customer id firstname =@ctx components firstname state value lastname =@ctx components lastname state value companyname =@ctx components companyname state value address =@ctx components address state value city =@ctx components city state value email =$lowercase(@ctx components email state value) examples of configuring the required id property when using queueoperation replace execute entity data id # this action is configured with a replace queue operation and the id is specified, \# in the data property the id comes from an input actions \ children \ type action execute entity options title update customer provider data provider rest entity customers method update function rest update customer \# replace current update on the queue queueoperation replace \# id is required for the replace operation data id =@ctx jig inputs customer id functionparameters firstname =@ctx components firstname state value lastname =@ctx components lastname state value companyname =@ctx components companyname state value address =@ctx components address state value city =@ctx components city state value customertype =@ctx components customertype state value email =$lowercase(@ctx components email state value) execute entity functionparameters id # this action is configured with a replace queue operation and the id is specified, \# in the functionparamaters property the id is specified in the function file under parameters actions \ children \ type action execute entity options title update customer provider data provider rest entity customers method update \# use replace to ensure you only have one update on the queue related to a record \# not adding the replace will not break the solution but will help to avoid chattiness and \# scenarios where backends have rate limits queueoperation replace goback previous function rest update customer functionparameters \# id is a required property for the replace queue id =@ctx jig inputs customer id firstname =@ctx components firstname state value lastname =@ctx components lastname state value companyname =@ctx components companyname state value address =@ctx components address state value city =@ctx components city state value email =$lowercase(@ctx components email state value) how to clear the queue for scenarios where operations on a record must be treated as draft and all queued commands must be removed without impacting the local record, use the clear queue action, and specify the id of the record and a title for the action see offline remote data handling docid\ h36q0e3t93lcbn9wejmjp example clear queue action actions \ children \ type action clear queue options title remove record from queue id =@ctx datasources region id queue handling for delete methods when using the replace property with a delete method, all commands on the queue for the specified record are removed the delete method will still delete the local entity record as expected, for example while offline a record is created with a tempid, then updated, and then deleted with a queueoperations replace , the commands for that record are removed from the queue and local entity will also be deleted this avoids the need for the full cycle of calls to be sent to the backend (create, update, delete) if the end result is that the record is deleted if the record to be delete has a valid id then the queueoperations add is used to add the record to the queue, when the device is back online the queue is processed and the record is deleted using the function if you want to cater for both tempid and avalid id records when offline in one queueoperation configuration use the following expression =$istempid(@ctx current item id) ? replace\ add execute entity delete actions \ children \ type action execute entity options title delete record provider data provider rest entity customers method delete \# for delete use an expression to evaluate if there is a valid or tempid if the record has a tempid it will remove all \# operations related to the record from the queue if it is a valid id the record will use the add and place it on the queue, which will delete the record from the remote data store using the function queueoperation =$istempid(@ctx current item id) ? replace\ add function rest delete customer functionparameters custid =$number(@ctx current item id) data id =@ctx current item id handling tempids all tempids for a record are replaced in all other queued commands if a valid id is returned if you use a record's id in another record while offline and a valid id is returned back when the device is back online, {{jigx}} updates the tempid used in all the other records that used it with the valid id this makes for smoother integration with backend systems as the ids will match up see rest best practice docid\ eytz5 sh7enejjudxqkhi for more information on returning the id examples and code snippets examples and code snippets execute entity with queueoperation (replace) in this example, when the device is offline and a customer record is created and then updated multiple times, only one create and one update command is queued when the device is back online the queue is cleared the remote data store returns an id that we can use to map back to the record locally in the outputtransform of the function (rest create customer) queueoperation is not required for the create of the customer because once the device comes online, the record will be created, and the id from the remote data store will be returned and any records with the same tempid will be updated with the returning id and will update the correct record the queueoperation replace is rather used in the update customer jig new customer jigx title new customer type jig default header type component jig header options height small children type component image options source uri https //www dropbox com/scl/fi/ha9zh6wnixblrbubrfg3e/business 5475661 640 jpg?rlkey=anemjh5c9qsspvzt5ri0i9hva\&raw=1 onfocus type action reset state options state =@ctx jig components customerform state data datasources region type datasource sqlite options provider data provider local entities \ entity us states query | select uss id as id, json extract(uss data, '$ state') as state, json extract(uss data, '$ abbreviation') as abbreviation, json extract(uss data, '$ statecapital') as statecapital, json extract(uss data, '$ region') as region, json extract(uss data, '$ flag') as flag from \[us states] as uss where json extract(uss data, '$ abbreviation') = @selectedstate queryparameters selectedstate =@ctx components usstate state value customertype type datasource static options data \ id 1 type new value new \ id 2 type gold value gold \ id 3 type silver value silver children \ type component form instanceid customerform options isdiscardchangesalertenabled false children \ type component text field instanceid companyname options label company name \ type component field row options children \ type component text field instanceid firstname options label first name \ type component text field instanceid lastname options label last name \ type component text field instanceid jobtitle options label job title \ type component text field instanceid email options label email \ type component text field instanceid phone1 options label mobile \ type component text field instanceid web options label web \ type component text field instanceid address options label street \ type component text field instanceid city options label city \ type component field row options children \ type component dropdown instanceid usstate options label state data =@ctx datasources us states item type component dropdown item options title =@ctx current item state value =@ctx current item abbreviation leftelement element avatar text =@ctx current item abbreviation uri =@ctx current item flag \ type component text field instanceid zip options label zip \ type component field row options children \ type component text field instanceid region options label region value =@ctx datasources region region \ type component dropdown instanceid customertype options label customer type data =@ctx datasources customertype item type component dropdown item options title =@ctx current item type value =@ctx current item value actions \ children \ type action execute entity options title create customer provider data provider rest entity customers method create \# in this scenario, the backend system returns an id that we can use to map back to the record \# locally in the output transform of the function (rest create customer) you don’t need to use \# queueoperation in this scenario once the device goes online, the record will be created, and \# the id from the backend will come back any records with the same tempid will be updated with \# the returning id and will update the correct record function rest create customer functionparameters firstname =@ctx components firstname state value lastname =@ctx components lastname state value companyname =@ctx components companyname state value address =@ctx components address state value city =@ctx components city state value customertype =@ctx components customertype state value email =$lowercase(@ctx components email state value) jobtitle =@ctx components jobtitle state value phone1 =@ctx components phone1 state value phone2 =@ctx components phone1 state value region =@ctx components region state value state =@ctx components usstate state value web =$lowercase(@ctx components web state value) zip =@ctx components zip state value update customer jigx title update customer type jig default header type component jig header options height small children type component image options source uri https //www dropbox com/scl/fi/ha9zh6wnixblrbubrfg3e/business 5475661 640 jpg?rlkey=anemjh5c9qsspvzt5ri0i9hva\&raw=1 datasources region type datasource static options data \ id 1 region us central \ id 2 region us east \ id 3 region us west customertype type datasource static options data \ id 1 type new value \ id 2 type gold value gold \ id 3 type silver value silver customers type datasource sqlite options provider data provider local entities \ entity customers query | select cus id as id, json extract(cus data, '$ firstname') as firstname, json extract(cus data, '$ lastname') as lastname, json extract(cus data, '$ companyname') as companyname, json extract(cus data, '$ address') as address, json extract(cus data, '$ city') as city, json extract(cus data, '$ state') as state, json extract(cus data, '$ zip') as zip, json extract(cus data, '$ phone1') as phone1, json extract(cus data, '$ phone2') as phone2, json extract(cus data, '$ email') as email, json extract(cus data, '$ web') as web, json extract(cus data, '$ customertype') as customertype, json extract(cus data, '$ jobtitle') as jobtitle, json extract(cus data, '$ region') as region from \[customers] as cus where id = @custid queryparameters custid =@ctx jig inputs customer id isdocument true children \ type component form instanceid customer options isdiscardchangesalertenabled false children \ type component text field instanceid companyname options label company name initialvalue =@ctx datasources customers companyname \ type component field row options children \ type component text field instanceid firstname options label first name initialvalue =@ctx datasources customers firstname \ type component text field instanceid lastname options label last name initialvalue =@ctx datasources customers lastname \ type component text field instanceid jobtitle options label job title initialvalue =@ctx datasources customers jobtitle \ type component text field instanceid email options label email initialvalue =@ctx datasources customers email \ type component text field instanceid phone1 options label mobile initialvalue =@ctx datasources customers phone1 \ type component text field instanceid web options label web initialvalue =@ctx datasources customers web \ type component text field instanceid address options label street initialvalue =@ctx datasources customers address \ type component text field instanceid city options label city initialvalue =@ctx datasources customers city \ type component field row options children \ type component text field instanceid state options label state initialvalue =@ctx datasources customers state \ type component text field instanceid zip options label zip initialvalue =@ctx datasources customers zip \ type component field row options children \ type component dropdown instanceid region options label region data =@ctx datasources region initialvalue =@ctx datasources customers region item type component dropdown item options title =@ctx current item region value =@ctx current item region \ type component dropdown instanceid customertype options label customer type data =@ctx datasources customertype initialvalue =@ctx datasources customers customertype item type component dropdown item options title =@ctx current item type value =@ctx current item value actions \ children \ type action execute entity options title update customer provider data provider rest entity customers method update \# use replace to ensure you only have one update on the queue related to a record \# not doing this will not break the solution but will help to avoid chattiness and \# scenarios where backends have rate limits queueoperation replace goback previous function rest update customer functionparameters \# id is a required function parameter when using the queueoperation replace id =@ctx jig inputs customer id firstname =@ctx components firstname state value lastname =@ctx components lastname state value companyname =@ctx components companyname state value address =@ctx components address state value city =@ctx components city state value customertype =@ctx components customertype state value email =$lowercase(@ctx components email state value) jobtitle =@ctx components jobtitle state value phone1 =@ctx components phone1 state value phone2 =@ctx components phone1 state value region =@ctx components region state value state =@ctx components state state value web =$lowercase(@ctx components web state value) zip =@ctx components zip state value rest create customer jigx (function) provider data provider rest method post # create new record in the backend url https //\[your rest service]/api/customers #use your rest service url uselocalcall true #direct the function call to use local execution between the mobile device and the rest service parameters accesstoken location header required true type string value service oauth #use manage jigx com to define credentials for your solution firstname type string location body required true lastname type string location body required true companyname type string location body required true address type string location body required false city type string location body required false state type string location body required false zip type string location body required false phone1 type string location body required false phone2 type string location body required false email type string location body required false web type string location body required false region type string location body required false customertype type string location body required false jobtitle type string location body required false inputtransform | { "firstname" firstname, "lastname" lastname, "companyname" companyname, "address" address, "city" city, "state" state, "zip" zip, "phone1" phone1, "phone2" phone2, "email" email, "web" web, "region" region, "customertype" customertype, "jobtitle" jobtitle } \# in this scenario, the backend system returns an id that we can use to map back to the record \# locally in the output transform of the function (rest create customer) you don’t need to use \# queueoperation in this scenario for create once the device goes online, the record will be \# created, and the id from the backend will come back any records with the same tempid will be \# updated with the returning id and will update the correct record outputtransform | { "id" custid, "status" status } rest update customer jigx (function) provider data provider rest method put url https //\[your rest service]/api/customers #use your rest service url uselocalcall true #direct the function call to use local execution between the mobile device and the rest service format text parameters accesstoken location header required true type string value service oauth #use manage jigx com to define credentials for your solution \#id is a required property when using the queueoperation replace id type int location body required true firstname type string location body required true lastname type string location body required true companyname type string location body required true address type string location body required false city type string location body required false state type string location body required false zip type string location body required false phone1 type string location body required false phone2 type string location body required false email type string location body required false web type string location body required false region type string location body required false customertype type string location body required false jobtitle type string location body required false inputtransform | { "custid" id, "firstname" firstname, "lastname" lastname, "companyname" companyname, "address" address, "city" city, "state" state, "zip" zip, "phone1" phone1, "phone2" phone2, "email" email, "web" web, "region" region, "customertype" customertype, "jobtitle" jobtitle } execute entity with queueoperation (add) in this example, when the device is offline and a customer record is updated multiple times , all the update commands are queued when the device is back online the queue is cleared update customer jigx title update customer type jig default header type component jig header options height small children type component image options source uri https //www dropbox com/scl/fi/ha9zh6wnixblrbubrfg3e/business 5475661 640 jpg?rlkey=anemjh5c9qsspvzt5ri0i9hva\&raw=1 datasources region type datasource static options data \ id 1 region us central \ id 2 region us east \ id 3 region us west customertype type datasource static options data \ id 1 type new value \ id 2 type gold value gold \ id 3 type silver value silver customers type datasource sqlite options provider data provider local entities \ entity customers query | select cus id as id, json extract(cus data, '$ firstname') as firstname, json extract(cus data, '$ lastname') as lastname, json extract(cus data, '$ companyname') as companyname, json extract(cus data, '$ address') as address, json extract(cus data, '$ city') as city, json extract(cus data, '$ state') as state, json extract(cus data, '$ zip') as zip, json extract(cus data, '$ phone1') as phone1, json extract(cus data, '$ phone2') as phone2, json extract(cus data, '$ email') as email, json extract(cus data, '$ web') as web, json extract(cus data, '$ customertype') as customertype, json extract(cus data, '$ jobtitle') as jobtitle, json extract(cus data, '$ region') as region from \[customers] as cus where id = @custid queryparameters custid =@ctx jig inputs customer id isdocument true children \ type component form instanceid customer options isdiscardchangesalertenabled false children \ type component text field instanceid companyname options label company name initialvalue =@ctx datasources customers companyname \ type component field row options children \ type component text field instanceid firstname options label first name initialvalue =@ctx datasources customers firstname \ type component text field instanceid lastname options label last name initialvalue =@ctx datasources customers lastname \ type component text field instanceid jobtitle options label job title initialvalue =@ctx datasources customers jobtitle \ type component text field instanceid email options label email initialvalue =@ctx datasources customers email \ type component text field instanceid phone1 options label mobile initialvalue =@ctx datasources customers phone1 \ type component text field instanceid web options label web initialvalue =@ctx datasources customers web \ type component text field instanceid address options label street initialvalue =@ctx datasources customers address \ type component text field instanceid city options label city initialvalue =@ctx datasources customers city \ type component field row options children \ type component text field instanceid state options label state initialvalue =@ctx datasources customers state \ type component text field instanceid zip options label zip initialvalue =@ctx datasources customers zip \ type component field row options children \ type component dropdown instanceid region options label region data =@ctx datasources region initialvalue =@ctx datasources customers region item type component dropdown item options title =@ctx current item region value =@ctx current item region \ type component dropdown instanceid customertype options label customer type data =@ctx datasources customertype initialvalue =@ctx datasources customers customertype item type component dropdown item options title =@ctx current item type value =@ctx current item value actions \ children \ type action execute entity options title update customer provider data provider rest entity customers method update \# use add to queue all the updates related to a record queueoperation add function rest update customer functionparameters id =@ctx jig inputs customer id firstname =@ctx components firstname state value lastname =@ctx components lastname state value companyname =@ctx components companyname state value address =@ctx components address state value city =@ctx components city state value customertype =@ctx components customertype state value email =$lowercase(@ctx components email state value) jobtitle =@ctx components jobtitle state value phone1 =@ctx components phone1 state value phone2 =@ctx components phone1 state value region =@ctx components region state value state =@ctx components state state value web =$lowercase(@ctx components web state value) zip =@ctx components zip state value rest update customer jigx (function) provider data provider rest method put url https //\[your rest service]/api/customers #use your rest service url uselocalcall true #direct the function call to use local execution between the mobile device and the rest service format text parameters accesstoken location header required true type string value service oauth #use manage jigx com to define credentials id type int location body required true firstname type string location body required true lastname type string location body required true companyname type string location body required true address type string location body required false city type string location body required false state type string location body required false zip type string location body required false phone1 type string location body required false phone2 type string location body required false email type string location body required false web type string location body required false region type string location body required false customertype type string location body required false jobtitle type string location body required false inputtransform | { "custid" id, "firstname" firstname, "lastname" lastname, "companyname" companyname, "address" address, "city" city, "state" state, "zip" zip, "phone1" phone1, "phone2" phone2, "email" email, "web" web, "region" region, "customertype" customertype, "jobtitle" jobtitle } execute entity (delete) with queueoperation (replace) in this example, when the device is offline and a customer record is updated multiple times and then deleted, all the the commands for the record are removed from the queue and local entity is deleted when the device is back online the queue is cleared delete customer title customers type jig list icon list header type component jig header options height small children type component image options source uri https //www dropbox com/scl/fi/ha9zh6wnixblrbubrfg3e/business 5475661 640 jpg?rlkey=anemjh5c9qsspvzt5ri0i9hva\&raw=1 onrefresh type action execute action options action load customers datasources customers type datasource sqlite options provider data provider local entities \ entity customers query | select cus id as id, json extract(cus data, '$ firstname') as firstname, json extract(cus data, '$ lastname') as lastname, json extract(cus data, '$ companyname') as companyname, json extract(cus data, '$ address') as address, json extract(cus data, '$ city') as city, json extract(cus data, '$ state') as state, json extract(cus data, '$ zip') as zip, json extract(cus data, '$ phone1') as phone1, json extract(cus data, '$ phone2') as phone2, json extract(cus data, '$ email') as email, json extract(cus data, '$ web') as web, json extract(cus data, '$ customertype') as customertype, json extract(cus data, '$ jobtitle') as jobtitle, json extract(cus data, '$ logo') as logo from \[customers] as cus \ order by \ json extract(cus data, '$ companyname') data =@ctx datasources customers item type component list item options title =@ctx current item companyname & ' (' & @ctx current item id & ')' subtitle =@ctx current item firstname & ' ' & @ctx current item lastname leftelement element avatar text =@ctx current item state uri =@ctx current item logo label title =$uppercase((@ctx current item customertype = 'silver' ? @ctx current item customertype @ctx current item customertype = 'gold' ? @ctx current item customertype '')) color \ when =@ctx current item customertype = 'gold' color color3 \ when =@ctx current item customertype = 'silver' color color14 onpress type action go to options linkto update customer parameters customer =@ctx current item swipeable left \ label delete icon delete 2 color negative onpress type action confirm options isconfirmedautomatically false onconfirmed type action execute entity options provider data provider rest entity customers method delete \# for delete use replace, if the record has tempid it will remove all \# opperations related to the record from the queue queueoperation replace function rest delete customer functionparameters custid =$number(@ctx current item id) data id =@ctx current item id modal title are you sure? description =('press confirm to permanently delete ' & @ctx current item companyname) rest delete customer jigx (function) provider data provider rest method delete url https //\[your rest service]/api/customers?id={custid} #use your rest service url uselocalcall true #direct the function call to use local execution between the mobile device and the rest service format text parameters accesstoken location header required true type string value service oauth #use manage jigx com to define credentials for your solution custid type int location query required true execute entity with queueoperations when no id is returned in this example, the remote data store does not return an id, and we need to sync the data before we get the correct backend id for the record we need to be careful not to create and update the same record on the queue because the backend cannot associate the records after the sync to accomodate for this in the update customer {{jig}} we configure two execute entity actions the first action checks to see if a record has a tempid by using the following expression when =$istempid(@ctx jig inputs customer id) if the record on the queue has a tempid, we replace it using the create method with a new item that will be placed on the queue the second action checks to see if the record has a valid id rather than a tempid by using the following expression when =$not($istempid(@ctx jig inputs customer id)) if the record on the queue has a valid id, we replace it using the update method with an item that will be placed on the queue new customer jigx title new customer type jig default header type component jig header options height small children type component image options source uri https //www dropbox com/scl/fi/ha9zh6wnixblrbubrfg3e/business 5475661 640 jpg?rlkey=anemjh5c9qsspvzt5ri0i9hva\&raw=1 onfocus type action reset state options state =@ctx jig components customerform state data datasources region type datasource sqlite options provider data provider local entities \ entity us states query | select uss id as id, json extract(uss data, '$ state') as state, json extract(uss data, '$ abbreviation') as abbreviation, json extract(uss data, '$ statecapital') as statecapital, json extract(uss data, '$ region') as region, json extract(uss data, '$ flag') as flag from \[us states] as uss where json extract(uss data, '$ abbreviation') = @selectedstate queryparameters selectedstate =@ctx components usstate state value customertype type datasource static options data \ id 1 type new value new \ id 2 type gold value gold \ id 3 type silver value silver children \ type component form instanceid customerform options isdiscardchangesalertenabled false children \ type component text field instanceid companyname options label company name \ type component field row options children \ type component text field instanceid firstname options label first name \ type component text field instanceid lastname options label last name \ type component text field instanceid jobtitle options label job title \ type component text field instanceid email options label email \ type component text field instanceid phone1 options label mobile \ type component text field instanceid web options label web \ type component text field instanceid address options label street \ type component text field instanceid city options label city \ type component field row options children \ type component dropdown instanceid usstate options label state data =@ctx datasources us states item type component dropdown item options title =@ctx current item state value =@ctx current item abbreviation leftelement element avatar text =@ctx current item abbreviation uri =@ctx current item flag \ type component text field instanceid zip options label zip \ type component field row options children \ type component text field instanceid region options label region value =@ctx datasources region region \ type component dropdown instanceid customertype options label customer type data =@ctx datasources customertype item type component dropdown item options title =@ctx current item type value =@ctx current item value actions \ children \ type action execute entity options title create customer provider data provider rest entity customers method create \# in this scenario, the backend system does not return an id, you need to sync \# the data before we get the correct backend id for the record with this in mind, \# you'll need to be careful not to create and update the same record on the queue \# because the backend cannot associate the records after the sync have a look at \# the update jig to see the correct way of dealing with this scenario function rest create customer functionparameters firstname =@ctx components firstname state value lastname =@ctx components lastname state value companyname =@ctx components companyname state value address =@ctx components address state value city =@ctx components city state value customertype =@ctx components customertype state value email =$lowercase(@ctx components email state value) jobtitle =@ctx components jobtitle state value phone1 =@ctx components phone1 state value phone2 =@ctx components phone1 state value region =@ctx components region state value state =@ctx components usstate state value web =$lowercase(@ctx components web state value) zip =@ctx components zip state value update customer jigx title update customer type jig default header type component jig header options height small children type component image options source uri https //www dropbox com/scl/fi/ha9zh6wnixblrbubrfg3e/business 5475661 640 jpg?rlkey=anemjh5c9qsspvzt5ri0i9hva\&raw=1 datasources region type datasource static options data \ id 1 region us central \ id 2 region us east \ id 3 region us west customertype type datasource static options data \ id 1 type new value \ id 2 type gold value gold \ id 3 type silver value silver customers type datasource sqlite options provider data provider local entities \ entity customers query | select cus id as id, json extract(cus data, '$ firstname') as firstname, json extract(cus data, '$ lastname') as lastname, json extract(cus data, '$ companyname') as companyname, json extract(cus data, '$ address') as address, json extract(cus data, '$ city') as city, json extract(cus data, '$ state') as state, json extract(cus data, '$ zip') as zip, json extract(cus data, '$ phone1') as phone1, json extract(cus data, '$ phone2') as phone2, json extract(cus data, '$ email') as email, json extract(cus data, '$ web') as web, json extract(cus data, '$ customertype') as customertype, json extract(cus data, '$ jobtitle') as jobtitle, json extract(cus data, '$ region') as region from \[customers] as cus where id = @custid queryparameters custid =@ctx jig inputs customer id isdocument true children \ type component form instanceid customer options isdiscardchangesalertenabled false children \ type component text field instanceid companyname options label company name initialvalue =@ctx datasources customers companyname \ type component field row options children \ type component text field instanceid firstname options label first name initialvalue =@ctx datasources customers firstname \ type component text field instanceid lastname options label last name initialvalue =@ctx datasources customers lastname \ type component text field instanceid jobtitle options label job title initialvalue =@ctx datasources customers jobtitle \ type component text field instanceid email options label email initialvalue =@ctx datasources customers email \ type component text field instanceid phone1 options label mobile initialvalue =@ctx datasources customers phone1 \ type component text field instanceid web options label web initialvalue =@ctx datasources customers web \ type component text field instanceid address options label street initialvalue =@ctx datasources customers address \ type component text field instanceid city options label city initialvalue =@ctx datasources customers city \ type component field row options children \ type component text field instanceid state options label state initialvalue =@ctx datasources customers state \ type component text field instanceid zip options label zip initialvalue =@ctx datasources customers zip \ type component field row options children \ type component dropdown instanceid region options label region data =@ctx datasources region initialvalue =@ctx datasources customers region item type component dropdown item options title =@ctx current item region value =@ctx current item region \ type component dropdown instanceid customertype options label customer type data =@ctx datasources customertype initialvalue =@ctx datasources customers customertype item type component dropdown item options title =@ctx current item type value =@ctx current item value actions \ children \ type action execute entity \# the best way to tell if a record has a temp id is to use the following function \# =$istempid(@ctx jig inputs customer id) if you have a record on the queue with \# a temp id, you need to replace it with a new item that will be placed on the queue when =$istempid(@ctx jig inputs customer id) options title update customer provider data provider rest entity customers method create goback previous function rest create customer \# replace current create on the queue queueoperation replace \# replace requires an id, if no id is specified in the functionparameter, \# use the data property to specify the id data id =@ctx jig inputs customer id functionparameters firstname =@ctx components firstname state value lastname =@ctx components lastname state value companyname =@ctx components companyname state value address =@ctx components address state value city =@ctx components city state value customertype =@ctx components customertype state value email =$lowercase(@ctx components email state value) jobtitle =@ctx components jobtitle state value phone1 =@ctx components phone1 state value phone2 =@ctx components phone1 state value region =@ctx components region state value state =@ctx components state state value web =$lowercase(@ctx components web state value) zip =@ctx components zip state value \ type action execute entity when =$not($istempid(@ctx jig inputs customer id)) options title update customer provider data provider rest entity customers method update goback previous queueoperation replace function rest update customer functionparameters id =@ctx jig inputs customer id firstname =@ctx components firstname state value lastname =@ctx components lastname state value companyname =@ctx components companyname state value address =@ctx components address state value city =@ctx components city state value customertype =@ctx components customertype state value email =$lowercase(@ctx components email state value) jobtitle =@ctx components jobtitle state value phone1 =@ctx components phone1 state value phone2 =@ctx components phone1 state value region =@ctx components region state value state =@ctx components state state value web =$lowercase(@ctx components web state value) zip =@ctx components zip state value rest create customer jigx (function) provider data provider rest method post # create new record in the backend url url https //\[your rest service]/api/customers #use your rest service url uselocalcall true parameters accesstoken location header required true type string value service oauth #use manage jigx com to define credentials for your solution firstname type string location body required true lastname type string location body required true companyname type string location body required true address type string location body required false city type string location body required false state type string location body required false zip type string location body required false phone1 type string location body required false phone2 type string location body required false email type string location body required false web type string location body required false region type string location body required false customertype type string location body required false jobtitle type string location body required false inputtransform | { "firstname" firstname, "lastname" lastname, "companyname" companyname, "address" address, "city" city, "state" state, "zip" zip, "phone1" phone1, "phone2" phone2, "email" email, "web" web, "region" region, "customertype" customertype, "jobtitle" jobtitle } \# in this scenario, the backend system does not return an id, you need to sync \# the data before we get the correct backend id for the record with this in mind, \# you'll need to be careful not to create and update the same record on the queue \# because the backend cannot associate the records after the sync have a look at \# the update jig to see the correct way of dealing with this scenario clear all commands in the queue for record in this example, a secondary button is added to clear the queue for all commands using the action clear queue clear customer updates jigx title update customer type jig default header type component jig header options height small children type component image options source uri https //www dropbox com/scl/fi/ha9zh6wnixblrbubrfg3e/business 5475661 640 jpg?rlkey=anemjh5c9qsspvzt5ri0i9hva\&raw=1 datasources region type datasource static options data \ id 1 region us central \ id 2 region us east \ id 3 region us west customertype type datasource static options data \ id 1 type new value \ id 2 type gold value gold \ id 3 type silver value silver customers type datasource sqlite options provider data provider local entities \ entity customers query | select cus id as id, json extract(cus data, '$ firstname') as firstname, json extract(cus data, '$ lastname') as lastname, json extract(cus data, '$ companyname') as companyname, json extract(cus data, '$ address') as address, json extract(cus data, '$ city') as city, json extract(cus data, '$ state') as state, json extract(cus data, '$ zip') as zip, json extract(cus data, '$ phone1') as phone1, json extract(cus data, '$ phone2') as phone2, json extract(cus data, '$ email') as email, json extract(cus data, '$ web') as web, json extract(cus data, '$ customertype') as customertype, json extract(cus data, '$ jobtitle') as jobtitle, json extract(cus data, '$ region') as region from \[customers] as cus where id = @custid queryparameters custid =@ctx jig inputs customer id children \ type component form instanceid customer options isdiscardchangesalertenabled false children \ type component text field instanceid companyname options label company name initialvalue =@ctx datasources customers companyname \ type component field row options children \ type component text field instanceid firstname options label first name initialvalue =@ctx datasources customers firstname \ type component text field instanceid lastname options label last name initialvalue =@ctx datasources customers lastname \ type component text field instanceid jobtitle options label job title initialvalue =@ctx datasources customers jobtitle \ type component text field instanceid email options label email initialvalue =@ctx datasources customers email \ type component text field instanceid phone1 options label mobile initialvalue =@ctx datasources customers phone1 \ type component text field instanceid web options label web initialvalue =@ctx datasources customers web \ type component text field instanceid address options label street initialvalue =@ctx datasources customers address \ type component text field instanceid city options label city initialvalue =@ctx datasources customers city \ type component field row options children \ type component text field instanceid state options label state initialvalue =@ctx datasources customers state \ type component text field instanceid zip options label zip initialvalue =@ctx datasources customers zip \ type component field row options children \ type component dropdown instanceid region options label region data =@ctx datasources region initialvalue =@ctx datasources customers region item type component dropdown item options title =@ctx current item region value =@ctx current item region \ type component dropdown instanceid customertype options label customer type data =@ctx datasources customertype initialvalue =@ctx datasources customers customertype item type component dropdown item options title =@ctx current item type value =@ctx current item value actions \ children \ type action execute entity options title update customer provider data provider rest entity customers method update \# use replace to ensure you only have one update on the queue related to a record \# not doing this will not break the solution but will help to avoid chattiness and \# scenarios where backends have rate limits queueoperation replace function rest update customer functionparameters id =@ctx jig inputs customer id firstname =@ctx components firstname state value lastname =@ctx components lastname state value companyname =@ctx components companyname state value address =@ctx components address state value city =@ctx components city state value customertype =@ctx components customertype state value email =$lowercase(@ctx components email state value) jobtitle =@ctx components jobtitle state value phone1 =@ctx components phone1 state value phone2 =@ctx components phone1 state value region =@ctx components region state value state =@ctx components state state value web =$lowercase(@ctx components web state value) zip =@ctx components zip state value \# use the clear queue to discard any commands in the queue while the device is offline \ type action clear queue options title cancel all updates id =@ctx jig inputs customer id testing and debugging queues as you add the queueoperation property to actions, it is helpful to test or debug that the commands are being executed as configured here is a {{jig}} that can help you see the commands being queued when the device is offline, and then see the queue clear when the device is back online debugging queues title queue type jig list icon database 2 datasources listdata type datasource sqlite options provider data provider local entities \ commandqueue query | select id, json extract(payload, '$ functionid') as functionid, \[type], \[queue], \[state], \[error], @dummy as dummy from \[ commandqueue] queryparameters dummy =@ctx jig inputs dummyid data =@ctx datasources listdata item type component list item options title =@ctx current item functionid & ' ' & @ctx current item dummy subtitle =@ctx current item type & ' ' & @ctx current item state description =@ctx current item error