Simple contact form with default values and validation.
{
"schema": {
"type": "object",
"properties": {
"name": {
"type": "string",
"title": "Your Name",
"minLength": 3,
"maxLength": 100,
"description": "Please enter your full name"
},
"email": {
"type": "string",
"title": "Your Email",
"format": "email",
"minLength": 3,
"maxLength": 80,
"description": "We'll use this to contact you back"
},
"telephone": {
"type": "string",
"title": "Your Telephone",
"format": "tel",
"minLength": 10,
"maxLength": 15,
"description": "Optional phone number"
},
"company": {
"type": "string",
"title": "Your Company",
"minLength": 3,
"maxLength": 100,
"description": "Where do you work?"
},
"subject": {
"type": "string",
"title": "Subject",
"minLength": 3,
"maxLength": 100,
"description": "Brief description of your inquiry"
},
"message": {
"type": "string",
"title": "Your Message",
"minLength": 10,
"maxLength": 1000,
"description": "Please provide details about your inquiry"
},
"priority": {
"type": "string",
"title": "Priority Level",
"enum": [
"low",
"medium",
"high",
"urgent"
],
"default": "medium",
"description": "How urgent is your request?"
},
"preferredContact": {
"type": "string",
"title": "Preferred Contact Method",
"enum": [
"email",
"phone",
"both"
],
"default": "email",
"description": "How would you like us to contact you?"
}
},
"required": [
"name",
"email",
"subject",
"message"
]
},
"uischema": {
"type": "VerticalLayout",
"elements": [
{
"type": "Group",
"label": "Personal Information",
"elements": [
{
"type": "HorizontalLayout",
"elements": [
{
"type": "Control",
"scope": "#/properties/name",
"options": {
"placeholder": "Enter your full name"
}
},
{
"type": "Control",
"scope": "#/properties/email",
"options": {
"placeholder": "[email protected]"
}
}
]
},
{
"type": "HorizontalLayout",
"elements": [
{
"type": "Control",
"scope": "#/properties/telephone",
"options": {
"placeholder": "+1 (555) 123-4567"
}
},
{
"type": "Control",
"scope": "#/properties/company",
"options": {
"placeholder": "Your company name"
}
}
]
}
]
},
{
"type": "Group",
"label": "Message Details",
"elements": [
{
"type": "Control",
"scope": "#/properties/subject",
"options": {
"placeholder": "Brief description of your inquiry"
}
},
{
"type": "Control",
"scope": "#/properties/message",
"options": {
"type": "textarea",
"rows": 5,
"placeholder": "Please provide detailed information about your inquiry..."
}
},
{
"type": "HorizontalLayout",
"elements": [
{
"type": "Control",
"scope": "#/properties/priority",
"options": {
"format": "radio"
}
},
{
"type": "Control",
"scope": "#/properties/preferredContact",
"options": {
"format": "select"
}
}
]
}
]
}
]
},
"data": {
"name": "John Doe",
"email": "[email protected]",
"telephone": "+1 (555) 123-4567",
"company": "Acme Corporation",
"subject": "Product Inquiry",
"message": "I'm interested in learning more about your services.",
"priority": "medium",
"preferredContact": "email"
}
}{
"type": "object",
"properties": {
"name": {
"type": "string",
"title": "Your Name",
"description": "Please enter your full name",
"maxLength": 100,
"minLength": 3
},
"email": {
"type": "string",
"title": "Your Email",
"description": "We'll use this to contact you back",
"format": "email",
"maxLength": 80,
"minLength": 3
},
"telephone": {
"type": "string",
"title": "Your Telephone",
"description": "Optional phone number",
"format": "tel",
"maxLength": 15,
"minLength": 10
},
"company": {
"type": "string",
"title": "Your Company",
"description": "Where do you work?",
"maxLength": 100,
"minLength": 3
},
"subject": {
"type": "string",
"title": "Subject",
"description": "Brief description of your inquiry",
"maxLength": 100,
"minLength": 3
},
"message": {
"type": "string",
"title": "Your Message",
"description": "Please provide details about your inquiry",
"maxLength": 1000,
"minLength": 10
},
"priority": {
"type": "string",
"title": "Priority Level",
"description": "How urgent is your request?",
"default": "medium",
"enum": [
"low",
"medium",
"high",
"urgent"
]
},
"preferredContact": {
"type": "string",
"title": "Preferred Contact Method",
"description": "How would you like us to contact you?",
"default": "email",
"enum": [
"email",
"phone",
"both"
]
}
},
"required": [
"name",
"email",
"subject",
"message"
]
}{
"type": "VerticalLayout",
"elements": [
{
"type": "Group",
"label": "Personal Information",
"elements": [
{
"type": "HorizontalLayout",
"elements": [
{
"type": "Control",
"scope": "#/properties/name",
"options": {
"placeholder": "Enter your full name"
}
},
{
"type": "Control",
"scope": "#/properties/email",
"options": {
"placeholder": "[email protected]"
}
}
]
},
{
"type": "HorizontalLayout",
"elements": [
{
"type": "Control",
"scope": "#/properties/telephone",
"options": {
"placeholder": "+1 (555) 123-4567"
}
},
{
"type": "Control",
"scope": "#/properties/company",
"options": {
"placeholder": "Your company name"
}
}
]
}
]
},
{
"type": "Group",
"label": "Message Details",
"elements": [
{
"type": "Control",
"scope": "#/properties/subject",
"options": {
"placeholder": "Brief description of your inquiry"
}
},
{
"type": "Control",
"scope": "#/properties/message",
"options": {
"type": "textarea",
"rows": 5,
"placeholder": "Please provide detailed information about your inquiry..."
}
},
{
"type": "HorizontalLayout",
"elements": [
{
"type": "Control",
"scope": "#/properties/priority",
"options": {
"format": "radio"
}
},
{
"type": "Control",
"scope": "#/properties/preferredContact",
"options": {
"format": "select"
}
}
]
}
]
}
]
}{
"name": "John Doe",
"email": "[email protected]",
"telephone": "+1 (555) 123-4567",
"company": "Acme Corporation",
"subject": "Product Inquiry",
"message": "I'm interested in learning more about your services.",
"priority": "medium",
"preferredContact": "email"
}