Hello,
I am implementing the Open Source version into my application with the Laravel Framework. I am stuck with the File component.
As Laravel expects a valid CSRF-token for every request done within the application, I have to pass a CSRF-token in the headers with the request. Now I get an error in the component when I upload a file: "r.message.replace is not a function"
Can someone help me out?
Hello,
I'm trying to implement custom validations, mainly I need to connect 2-4 fields together in order for at least one to be required. I thought I can catch if other components are valid or not and make the others valid if one of them is valid. Couldn't find the property for that. Would be thankful if you could give me the right path
Thanks
formio/angular#860
I want change this color (example my left panel). I see my element in inspector Chrome, but it is dynamic
And second question can i edit modal window with properties (css styles). Thanks
1 reply
return ParentCompoenent.schema({
label: DISPLAY,
type: ID,
key: ID,
clearOnHide: true,
tableView: true,
persistent: false,
autoAdjust: true,
hideLabel: true,
storage: 'resources',
columns: [
{ components: [ {
label:'country',
key: 'country',
type: 'select',
input: true,
dataSrc: 'url',
validate: {
required: true
},
template: '<span>{{ item.value }}</span>',
data: {
url:'https://timisenco2015.github.io/formulator.github.com/data/country.json'
}
}], width: 4, offset: 0, push: 0, pull: 0, size: 'md' },
{ components: [ {
label:'province',
key: 'province',
type: 'select',
input: true,
refreshOn: '{{row.country.label}}',
clearOnRefresh: true,
dataSrc: 'url',
onChange(context) {
context.instance.root.getComponent('province').setValue('searchField');
},
validate: {
required: true
},
template: '<span>{{ item.value }}</span>',
data: {
url:
https://timisenco2015.github.io/formulator.github.com/data/{{ row.country.label }}.json}
}], width: 4, offset: 0, push: 0, pull: 0, size: 'md' },
{ components: [ {
label:'City',
key: 'city',
type: 'select',
input: true,
refreshOn: '{{row.province.label}}',
clearOnRefresh: true,
dataSrc: 'url',
validate: {
required: true
},
template: '<span>{{ item.value }}</span>',
data: {
url:'https://timisenco2015.github.io/formulator.github.com/data/{{ row.province.label }}.json'
}
}], width: 4, offset: 0, push: 0, pull: 0, size: 'md' },
{ components: [ {
label:'Postal Code',
key: 'postalCode',
type: 'textfield',
input: true,
dataSrc: 'values',
refreshOn: true,
redrawOn: true,
validate: {
required: true
},
data: {
values: [
{
label: 'Chevy',
value: 'chevrolet'
},
{
value: 'honda',
label: 'Honda'
},
{
label: 'Ford',
value: 'ford'
},
{
label: 'Toyota',
value: 'toyota'
}
]
}
}], width: 3, offset: 0, push: 0, pull: 0, size: 'md' },
],
}, ...extend)
}
1 reply
2 replies
Hi I want to disable a nested radio control, but I want to do it from a parent form, as the control is reused across different forms. I tried using the Merge Component Schema action based off the "formLoad" event. The idea was to follow the approach of setting the schema = {..., propToOverride: overwrittenValue... }, although this did not work. I suspect its because the schema of the component has Components itself and merging an array of objects, would involve having some kind of discriminator key to identify which object the overwritten property it refers to. Eg:
Suppose original schema is following:
{
key: "loginFieldset",
type: "fieldset",
....
components: [
{ label: "Login" ... },
{ label: "Password" ... }
]
...
}And then I want to overwrite the "Password" label only, intuitively I'd do something like:
schema = {
components: [
{ label: "PasswordOverwritten" }
]
}However I can't see a way to physically merge these objects without telling it which label exactly I am intending to overwrite. A default behavior might be using the index but then that would mean i need to have an empty object on position 0 etc...
Could I get a bit of insight on how this merging behavior works please? As currently no matter what I supply to that schema = ... it always keeps the original schema instead.
TIA
I have integrated the form.io application into my angular application but I am facing an issue in dropdowns at the time of searching. It is searching with case sensitivity only. But I want t the user can search in upper or lower case both.
I found a file name is angular-material-formio.js and function is
onFilter(value) {
this.filteredOptions = this.selectOptions.then((options) => {
const filtered = options.filter((option) => option.label.indexOf(value) !== -1);
this.filteredOptionsLength = filtered.length;
return filtered;
});
}
But not able to change this function into its library through my custom component.
Could you please tell me how I can solve this issue.
Note: Problem is coming with angular material only.
TIA
operable program or batch file.
https://nodejs.org/en/download/
Hello all,
I am having a problem in conditional cases of form. Some components are based on condition if the check box is being selected. However, if not selected they need not be displayed. This works as expected, but when I do the same and hide one of the components, the form has blank spaces all around. Is there any way that the blank spaces can be removed in the form based on condition.
Thanks in advance
I am having a while creating a wizard form. I have created the wizard form on the portal of formio where on first page i have used 2 fields which are required. The problem is that when i am embedding that form in my angular application onload the form is showing required error once the page get render. So is there any setting so that i can stop that required error at the time of load page. Please find the screen shot for the same.
Thanks in advance
