ODK2 - Pushing Data from custom UI to table

I designed a custom UI with HTML and JavaScript for my form but I don't know how to connect it with my form and push the data to table. is there any sample?

2 Likes

Welcome to the ODK forum, @Sakina_Alizada! We're glad you're here. When you get a chance, please introduce yourself here. I'd also encourage you to add a real picture as your avatar because it helps build community

Have you looked at the sample application in the ODK2 documentation?

I'm not yet familiar with the tools. You may need to provide some more details (or sample files if possible) for someone to help you with your question.

1 Like

Thank you for welcoming me.
There are some functions in OdkData.js or in OdkTable.js I want to use them but there is no guidance or sample about the parameters and return value.

is there any one that use them and have experience to help me?

1 Like

The ODK 2 framework injects JavaScript interfaces to interact with.

The documentation on the JavaScript interfaces is available:
https://docs.opendatakit.org/odk2/injected-interfaces

Specifically, for manipulating data in a table you will want to use odkdata.js:
https://docs.opendatakit.org/odk2/injected-interfaces/#odkdata-js

1 Like

I designed a custom UI for my form and in properties sheet I add my custom UI path but the problem is that in ODK Survey I can't see my custom UI.
does it need any configuration?customUI.zip (5.0 KB)

I designed a new UI but I don't know how to use it in Odk survey...

Please, let me know if there is any opinion or guidance.

We do have a gridScreen example in the AppDesigner (https://github.com/opendatakit/app-designer/tree/master/app/config/tables/gridScreen/forms/gridScreen). This gridScreen allows users in ODK Survey to display multiple prompts in a grid format on one screen, but not to create several rows of data in one prompt. If you want to create more than one row of data and link it back to a row in another table, you could use a subform (https://docs.opendatakit.org/odk2/survey-using/#opening-a-subform).

However, based on the zip file that you provided, you would probably be better served by creating a Tables app to do exactly what you want as it looks like you know your way around JavaScript. The documentation at https://docs.opendatakit.org/odk2/build-app/#odk-tables-designing-a-custom-view should help to get you started. Also, the documentation that Waylon mentioned above regarding the JavaScript interfaces explains the interfaces that are available to you to retrieve and store data. You can use a Tables app to create and delete rows in the database without using Survey which looks like what you want. In particular, take a look at https://github.com/opendatakit/app-designer/blob/master/app/system/js/odkData.js and look at the addRow and deleteRow functions.

1 Like