How to create a form from a json file in extjs - json

I have a json file simular to this:
[{
"name": "testReport",
"type": "Intern",
"description": "Test report for extjs",
"query": "select DATE(sa.startTime)",
"queryFields": [{
"name": "name",
"type": "STRING",
"format": null,
"many": false
}, {
"name": "from",
"type": "DATE",
"format": "yyyyMMdd",
"many": false
}, {
"name": "to",
"type": "DATE",
"format": "yyyyMMdd",
"many": false
}]
In a grid i show the name, type and description. When you click on a button i want to open a new window what is working. But what i need is to open the window and generate a form based on the queryFields. So when i click on the testreport i need to have a textfield(name), a datefield(from) and a datefield(to). Is this possible? And how do i do this :$

Use a SelectionModel (maybe a CheckBoxSelectionModel). The user will select the row they want by checking the check boxes of the rows. Then when they click the display reports button you can use the SelectionModel to find all the selected records and pass the records on to your form which which you can use to create the form or fill the forms fields in whichever you need.
My advice is to look at the API for
GridPanels
SelectionModels
Record
Then design it when you have an understanding of these concepts.

Related

Json schema restrictions on Value field that can be only integers without commas or periods

I have searched for information about how to create this field so that it only allows adding numbers and no other characters but no configuration works for the form to be built. I need the Json to create a dynamic form in Angular
"monto": {
"row": 3,
"type": "input",
"inputType": "integer",
"label": "Monto requerido (de $100 a $100.000)",
"required": true,
"validations": [
"required",
"min:100",
"max:100000"
]
}

How to use $when in an adaptive card template to find out the length of an incoming data payload and drop an input block

I have an adaptive card in the form of a JSON file, which contains an Input.ChoiceSet. This is provided with a data payload, which is dynamic and so it is not the same amount of data every time. I want to be able to drop this Input.ChoiceSet if it breaks a certain threshold based on the length of the array of data that I'm going to pass to it. Is it possible to write this as an condition inside the Input.ChoiceSet using %when to carry this out?
This is currently what I have, but it is not working as I would've hoped:
{
"type": "Input.ChoiceSet",
"id": "CompactSelectVal1",
"$when": "${$data.length < 400}",
"placeholder": "Select a value",
"choices": [
{
"$data": "${data}",
"title": "${name}",
"value": "${tag}"
}
],
"label": "Input"
}
Using .length here was just a guess here, not based on any documentation. The documentation I have used to find out about $when is the following https://learn.microsoft.com/en-us/adaptive-cards/templating/language.
Any help on this would be much appreciated.
You can use "count" property instead of "length" and also remove the extra '$' inside the curly bracket "${$data.length < 400}".
Try this:
{
"type": "Input.ChoiceSet",
"id": "CompactSelectVal1",
"$when": "${count(data) < 400}",
"placeholder": "Select a value",
"choices": [
{
"$data": "${data}",
"title": "${name}",
"value": "${tag}"
}
],
"label": "Input"
}
If the condition is true then the choice button will hide from the adaptive card.

Adaptive Cards - Is it possible to enforce that the user typed something in Input Text Field before Action.Submit is allowed

I'm trying to use adaptive cards on MS Teams to capture some user input text before they click on submit. One of the things I would like to have is that I want the user to input some non-empty string before the Action.Submit is allowed to go through.
Is that an existing support feature?
Thanks!
This feature, called Input Validation, is part of the upcoming v1.3 release, which will be available in Teams in the next few months. Here is a same that uses the "required" property to indicate something must be entered.
{
"type": "AdaptiveCard",
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"version": "1.3",
"body": [
{
"type": "Input.Text",
"id": "name",
"placeholder": "First, last",
"label": "Please enter your name",
"isRequired": true,
"errorMessage": "Name is required"
}
],
"actions": [
{
"type": "Action.Submit",
"title": "Save"
}
]
}
You can learn about it here. https://developer.microsoft.com/en-us/office/blogs/adaptive-cards-community-call-july-2020/

How can I sort a nested restheart data column?

I have a table with several columns which I need to be sorted. I'm using RestHeart Api and this is what I am feeding the column with:
{
"type": "text",
"size": "sm",
"id": "labelEstado",
"pathToValue": "estados___[key=='status']",
"text": "estado",
"icon": {
"cancelled": "glyphicon glyphicon-ban-circle fx-status-success",
"ok": "glyphicon glyphicon-ok fx-status-success",
},
"filter": true,
"sort": true
}
Something seems to be confusing the sorting process as the request is always passing the id in the GET request instead of "status" that is a "nested field" inside "estado"...
I tried
"sort": "status"
and
"sort": "estados.status"
but the GET request isn't filled properly (keeps ending in &sort_by=labelEstado) and no filter button over the column shows up.
How can I get the filter option to allow the filter button to show up but filter by "status" value?

Angular2/4 app to display forms based on JSON data using ngFor and ngIf only. Could it work?

I have to build an Angular application that has a single task: It receives JSON data that describe a form structure, e.g.:
{
"textbox": {
"type": "string",
"name": "name",
"maxlength": 30,
"description": "Full Name"
},
"textbox": {
"type": "string",
"name": "email",
"maxlength": 40,
"description": "Email"
},
"date": {
"name": "birthdate",
"description": "Birthdate"
},
"checkbox": {
"name": "subscribe",
"options": [
"Yes",
"No"
],
"default": "No",
"description": "Subscribe?"
},
"button": {
"type": "submit",
"description": "Send"
}
}
And it should display it: (All forms are different with varying elements.)
I'm relatively new to Angular and my initial approach would be to create a simple template that has an ngFor in it, and inside many ngIfs (one for text fileds, one for text area, another for radio button, and so on...) that examine for the "type" of the given form element, and if there is a match, it gets displayed with its attributes written in the JSON.
Is it a good idea to start like this, or should I first learn some more Angular to be able to come up with a more professional solution?
Are things like dynamic and reactive forms in Angular for this purpose, or which part of Angular should I have a deeper understanding in for this task?