Jig Types
jig.default
6min
type jig default is the most versatile {{jig}} allowing you to create a {{jig}} with various setup options such as a form docid\ digx9ijgzlsa22yfyeszy a list docid 9auyvjm1lnc6h0zp1ujca the {{jig}} which can be a part of the jig composite docid\ mphubbyw7oyp1lojad bh used with a combination of different components and actions jig default preview configuration options core structure children add the ui elements ( components docid\ uu0nisptjmp60lbphwqln ) under the children property, for example, component form use intellisense (ctrl+space) to select a component from the available list title provide the name of the screen if you do not want to show a title in a {{jig}} use title ' ' or add an expression other options the jig default is the most versatile {{jig}} available allowing you to create a variety of screens many options are available for configuration on this {{jig}} , see jig default specification docid\ hfuxpe94vobfzmo9bqvje for a list of the additional options examples and code snippets examples and code snippets the code below is an extract from the full jigx samples solution the code snippets describe the component discussed in this section for the solution to function in the jigx app download the full jigx samples project from github, and follow the instructions in setting up your solution docid 1gfew7grpvkfxon tsymp jig default as a form form jig examples see the full default form jigx code example in github datasource see the full datasource code example for dynamic data in github default form jigx title form type jig default actions \ children \ type action submit form options formid default form provider data provider dynamic title submit form method save entity default/form children \ type component form instanceid default form options children \ type component number field instanceid employee id options label employeeid ishidden true initialvalue =($count(@ctx datasources employees id) = 0 ? 1 $count(@ctx datasources employees id) + 1) \ type component avatar field instanceid employee photo options label photo \ type component section options title personal information children \ type component text field instanceid employee first name options label first name \ type component text field instanceid employee surname options label surname \ type component date picker instanceid employee date of birth options label date of birth \ type component email field instanceid employee email options label email icon email \ type component number field instanceid employee phone number options label phone number icon phone \ type component section options title business information children \ type component text field instanceid employee position options label position \ type component date picker instanceid employee startwork options label date of starting work \ type component media field instanceid employee contract options label contract mediatype image datasources datasources employees type datasource sqlite options provider data provider dynamic entities \ entity default/employees query | select id from \[default/employees] default jigx databaseid default tables employees null index jigx name form title default form category business tabs home jigid defaut form icon home apps logo jig default as a list default jig as a list examples see the full code sample with static data in github see the full code sample with dynamic data in github datasource see the full code sample for datasource for static data in github see the full datasource code samples for dynamic data for product and sales in github using the code below requires data in the database, the jigx sample solution has the data provided for products you can use the products csv file in github and upload it via the data docid 5w2tlpzbxlebboq83bzb configuration in {{jigxmanagement}} default list dynamic jigx title list type jig default children \ type component section options title products children \ type component list options data =@ctx datasources prods item type component product item options title =@ctx current item title image uri =@ctx current item uri tag =@ctx current item tag price value =@ctx current item price format numberstyle currency \ type component section options title sale children \ type component list options data =@ctx datasources sale item type component product item options title =@ctx current item title image uri =@ctx current item uri tag =@ctx current item tag price value =@ctx current item price format numberstyle currency discount =@ctx current item discount datasources datasources prods type datasource sqlite options provider data provider dynamic entities \ entity default/products query | select id, '$ title', '$ uri', '$ tag', '$ price', '$ category', '$ sale' from \[default/products] where '$ category' = 'product' and '$ sale' is null sales type datasource sqlite options provider data provider dynamic entities \ entity default/products query | select id, '$ title', '$ uri', '$ tag', '$ price', '$ category', '$ discount', '$ sale' from \[default/products] where '$ sale' = 'true' default jigx databaseid default tables products null other examples of jig default employee default jig examples see the full code sample with static data in gilthub see the full code sample with dynamic data in github datasource see the full datasource code sample for static data in github see the full datasource code samples for dynamic data in github using the code below requires data in the database, the jigx sample solution has the data provided for employees you can use the employee csv file in github and upload it via the data docid 5w2tlpzbxlebboq83bzb configuration in {{jigxmanagement}} employee detail dynamic jigx title employee detail type jig default children \ type component avatar options title '' uri =@ctx datasources employee detail dynamic photo size large align center \ type component entity options children \ type component section options title personal information children \ type component field row options children \ type component entity field options label birth date value =@ctx datasources employee detail dynamic birthdate \ type component entity field options label gender value =@ctx datasources employee detail dynamic gender \ type component field row options children \ type component entity field options label email value =@ctx datasources employee detail dynamic email contenttype email \ type component entity field options label phone value =@ctx datasources employee detail dynamic phone contenttype phone \ type component section options title address children \ type component field row options children \ type component entity field options label street value =@ctx datasources employee detail dynamic street \ type component entity field options label city value =@ctx datasources employee detail dynamic city \ type component field row options children \ type component entity field options label state value =@ctx datasources employee detail dynamic state \ type component entity field options label country value =@ctx datasources employee detail dynamic country \ type component list options data =@ctx datasources quartal ishorizontal true item type component pie chart options chart title text =@ctx current item title verticalalign center subtitle text =@ctx current item subtitle verticalalign center width 140 height 140 isanimated true legend ishidden true series \ data =@ctx current item data datasources datasources quartal type datasource static options data \ title 91% subtitle q1/2022 data \ y 91 color positive \ y 9 color transparent \ title 99% subtitle q2/2022 data \ y 99 color positive \ y 1 color transparent \ title 10% subtitle q3/2022 data \ y 10 color positive \ y 90 color transparent \ title 0% subtitle q4/2022 data \ y 0 color positive \ y 100 color transparent employee detail dynamic type datasource sqlite options provider data provider dynamic entities \ entity default/employees query | select id, '$ firstname', '$ lastname', '$ photo', '$ birthdate', '$ gender', '$ email', '$ phone', '$ street', '$ city', '$ state', '$ country', '$ category', '$ modify' from \[default/employees] where '$ category' = "employee detail" default jigx databaseid default tables employees null examples see full code sample with static data in github see full code sample with dynamic data in github datasource see the full datasource code sample for static data in github see the full datasource code sample for dynamic data in github using the code below requires data in the database, the jigx sample solution has the data provided for products you can use the products csv file in github and upload it via the data docid 5w2tlpzbxlebboq83bzb configuration in {{jigxmanagement}} default product detail dynamic jigx title name type jig default header type component jig header options height medium children type component image options title =@ctx datasources product detail dynamic title subtitle =@ctx datasources product detail dynamic price source uri =@ctx datasources product detail dynamic uri summary children type component summary options layout default title add to cart lefticon element icon name shopping cart empty 1 children \ type component entity options children \ type component entity field options label "" ismultiline true value =@ctx datasources product detail dynamic overview \ type component expander options header centerelement type component titles options title details children \ type component entity options children \ type component section options title bluetooth 4 0 connection children \ type component entity field options label "" ismultiline true value =@ctx datasources product detail dynamic bluetooth detail \ type component section options title fast, precise tracking children \ type component entity field options label "" ismultiline true value =@ctx datasources product detail dynamic precise detail \ type component section options title rechargeable type c port children \ type component entity field options label "" ismultiline true value =@ctx datasources product detail dynamic recharge detail \ type component section options title modern, ergonomic design children \ type component entity field options label "" ismultiline true value =@ctx datasources product detail dynamic design detail \ type component expander options header centerelement type component titles options title tech specs children \ type component entity options children \ type component section options title compatible devices children \ type component entity field options label "" ismultiline true value =@ctx datasources product detail dynamic compatible detail \ type component entity options children \ type component section options title weight children \ type component entity field options label "" ismultiline true value =@ctx datasources product detail dynamic weight detail \ type component entity options children \ type component section options title guarantee children \ type component entity field options label "" ismultiline true value =@ctx datasources product detail dynamic guarantee detail \ type component expander options header centerelement type component titles options title shipping & returns children \ type component entity options children \ type component entity field options label "" ismultiline true value =@ctx datasources product detail dynamic shipping detail datasources datasources products dynamic type datasource sqlite options provider data provider dynamic entities \ entity default/products query | select id, '$ title', '$ price', '$ uri', '$ overview', '$ bluetooth detail', '$ precise detail', '$ recharge detail', '$ design detail', '$ compatible detail', '$ weight detail', '$ guarantee detail', '$ shipping detail', '$ category', '$ productid' from \[default/products] where '$ category' = "detail" and '$ productid' = '2' default jigx databaseid default tables products null index jigx name default product detail title default form category business tabs home jigid defaut product detail dynamic icon home apps logo see also jigs (screens) docid\ vigjcny6nozg oaevzce7 related examples (github)