Got a bit of a complicated setup, I have a form that based on certain choices made by the user needs to dynamically add a set of separate questions. So far I have an endpoint that returns from PHP some JSON with the form configuration (I have an admin section to allow admins to dynamically build forms this endpoint lets me retrieve these by code/id) and I’m using the following to load and inject the form in to the main form
webix.ajax("https://example.org/get-form/CODE", function(text){ webix.ui(webix.DataDriver.json.toObject(text), $$("bookingQuestionnaire")); });
This loads works fine given this JSON
[{"view":"datatable","id":"IMP1","columns":[{"id":"subQuestionCode","header":""},{"id":"subQuestion","header":""},{"id":"IMP1-1","header":"Not much","template":"custom_radio"},{"id":"IMP1-2","header":"A bit","template":"custom_radio"},{"id":"IMP1-3","header":"A lot","template":"custom_radio"}],"data":[{"subQuestionCode":"IMP1-HS","subQuestion":"How Something?","0":{"IMP1-1":false},"1":{"IMP1-2":false},"2":{"IMP1-3":false}},{"subQuestionCode":"IMP1-HO","subQuestion":"How Often?","0":{"IMP1-1":false},"1":{"IMP1-2":false},"2":{"IMP1-3":false}},{"subQuestionCode":"IMP1-HB","subQuestion":"How bad?","0":{"IMP1-1":false},"1":{"IMP1-2":false},"2":{"IMP1-3":false}}],"autoheight":true}]
The problem comes when I need to define templates or event handlers as seen in the JSON for some columns in the datatable I need to use a custom function as a template, but the function name has to be saved as a string when sent as JSON which results in Webix rendering the cells as the string “custom_radio” instead of calling the function. I guess I’m going to run into a similar problem when I need to add a callback to handle the on click event for the radio buttons.
I’m guessing I should be using a different method to dynamically load this sub form, and have the endpoint return a pure JS object instead of JSON.