Add Section functionality to Nextcloud Forms
Description
This PR adds a new "Section" element type to Nextcloud Forms that acts as a visual separator to group fields logically, without affecting data storage, validation, or submission logic.
Functional Requirements
1. Section Creation
- New "Section" element type in the form editor
- Only parameter: section name (title) visible to users
2. Editor Display
- Sections appear as non-input elements
- Draggable for reordering
- Title displayed in bold/visually distinct style
- No description field for sections
- Bottom separator line for visual distinction
3. Form Filling Display
- Sections display as headings/subheadings at their position
- No influence on validation, mandatory fields, or submission flow
4. Export/View Responses Behavior
- Sections do not affect CSV export or response viewing
- Not stored in user responses
Technical Implementation
Backend Changes
Constants and Types
lib/Constants.php: Added ANSWER_TYPE_SECTION = 'section' constant
lib/ResponseDefinitions.php: Updated FormsQuestionType to include "section"
API Controller (lib/Controller/ApiController.php)
- Section Validation: Sections cannot be required, have options, or file uploads
- Answer Storage: Sections are filtered out from answer storage
- Export Filtering: Sections are excluded from submissions export
- Form Cloning: Sections maintain
isRequired = false when cloning forms
Submission Service (lib/Service/SubmissionService.php)
- Export Data: Sections are filtered out from CSV/Excel export data
- Validation: Sections are ignored during submission validation
Frontend Changes
Components
src/components/Questions/QuestionSection.vue: New component for section rendering
src/components/Questions/Question.vue: Updated to support section display and editing
src/models/AnswerTypes.js: Added section type with appropriate icon and labels
src/models/Constants.ts: Added ANSWER_TYPE_SECTION constant
Views
src/views/Create.vue: Updated to pass question type to components
src/views/Submit.vue: Updated to filter sections from validation and storage
src/components/Results/ResultsSummary.vue: Updated to handle sections in results display
src/components/Results/Submission.vue: Updated to filter sections from submission data
Testing
Backend Tests
ApiControllerTest.php
testUpdateQuestion_sectionCannotBeRequired(): Verifies sections cannot be made required
testNewOption_sectionCannotHaveOptions(): Verifies sections cannot have options
testUploadFiles_sectionCannotHaveFileUploads(): Verifies sections cannot have file uploads
testGetSubmissions_sectionsAreFilteredOut(): Verifies sections are filtered from export
testNewSubmission_sectionsAreNotStored(): Verifies sections are not stored in answers
SubmissionServiceTest.php
testGetSubmissionsData_sectionsAreFilteredOut(): Verifies sections are filtered from export data
testValidateSubmission_sectionsAreIgnored(): Verifies sections are ignored in validation
testValidateSubmission_sectionsCannotBeRequired(): Verifies sections cannot be required in validation
Files Changed
Backend Files
lib/Constants.php - Added section constant
lib/ResponseDefinitions.php - Updated type definitions
lib/Controller/ApiController.php - Added section validation and filtering
lib/Service/SubmissionService.php - Added export filtering
Frontend Files
src/components/Questions/QuestionSection.vue - New section component
src/components/Questions/Question.vue - Updated for section support
src/models/AnswerTypes.js - Added section type
src/models/Constants.ts - Added section constant
src/views/Create.vue - Updated component props
src/views/Submit.vue - Updated validation and storage logic
src/components/Results/ResultsSummary.vue - Updated results display
src/components/Results/Submission.vue - Updated submission handling
Test Files
tests/Unit/Controller/ApiControllerTest.php - Added section tests
tests/Unit/Service/SubmissionServiceTest.php - Added section tests
Screenshots
Before
- No section functionality available
After
- Section element available in form editor
- Sections display as visual separators with titles
- Sections can be reordered like other form elements
- Sections do not appear in form submissions or exports
Breaking Changes
None. This is a purely additive feature that does not affect existing functionality.
Notes to Reviewers
- All hardcoded string literals have been replaced with constants (
Constants::ANSWER_TYPE_SECTION on backend, ANSWER_TYPE_SECTION on frontend)
- Sections are completely filtered out from data storage and export to ensure they don't affect existing functionality
- Comprehensive test coverage has been added for all section-related functionality
- The implementation follows Nextcloud Forms coding standards and patterns
Related Issues
This PR implements the section functionality as requested in the technical specification.
Add Section functionality to Nextcloud Forms
Description
This PR adds a new "Section" element type to Nextcloud Forms that acts as a visual separator to group fields logically, without affecting data storage, validation, or submission logic.
Functional Requirements
1. Section Creation
2. Editor Display
3. Form Filling Display
4. Export/View Responses Behavior
Technical Implementation
Backend Changes
Constants and Types
lib/Constants.php: AddedANSWER_TYPE_SECTION = 'section'constantlib/ResponseDefinitions.php: UpdatedFormsQuestionTypeto include"section"API Controller (
lib/Controller/ApiController.php)isRequired = falsewhen cloning formsSubmission Service (
lib/Service/SubmissionService.php)Frontend Changes
Components
src/components/Questions/QuestionSection.vue: New component for section renderingsrc/components/Questions/Question.vue: Updated to support section display and editingsrc/models/AnswerTypes.js: Added section type with appropriate icon and labelssrc/models/Constants.ts: AddedANSWER_TYPE_SECTIONconstantViews
src/views/Create.vue: Updated to pass question type to componentssrc/views/Submit.vue: Updated to filter sections from validation and storagesrc/components/Results/ResultsSummary.vue: Updated to handle sections in results displaysrc/components/Results/Submission.vue: Updated to filter sections from submission dataTesting
Backend Tests
ApiControllerTest.php
testUpdateQuestion_sectionCannotBeRequired(): Verifies sections cannot be made requiredtestNewOption_sectionCannotHaveOptions(): Verifies sections cannot have optionstestUploadFiles_sectionCannotHaveFileUploads(): Verifies sections cannot have file uploadstestGetSubmissions_sectionsAreFilteredOut(): Verifies sections are filtered from exporttestNewSubmission_sectionsAreNotStored(): Verifies sections are not stored in answersSubmissionServiceTest.php
testGetSubmissionsData_sectionsAreFilteredOut(): Verifies sections are filtered from export datatestValidateSubmission_sectionsAreIgnored(): Verifies sections are ignored in validationtestValidateSubmission_sectionsCannotBeRequired(): Verifies sections cannot be required in validationFiles Changed
Backend Files
lib/Constants.php- Added section constantlib/ResponseDefinitions.php- Updated type definitionslib/Controller/ApiController.php- Added section validation and filteringlib/Service/SubmissionService.php- Added export filteringFrontend Files
src/components/Questions/QuestionSection.vue- New section componentsrc/components/Questions/Question.vue- Updated for section supportsrc/models/AnswerTypes.js- Added section typesrc/models/Constants.ts- Added section constantsrc/views/Create.vue- Updated component propssrc/views/Submit.vue- Updated validation and storage logicsrc/components/Results/ResultsSummary.vue- Updated results displaysrc/components/Results/Submission.vue- Updated submission handlingTest Files
tests/Unit/Controller/ApiControllerTest.php- Added section teststests/Unit/Service/SubmissionServiceTest.php- Added section testsScreenshots
Before
After
Breaking Changes
None. This is a purely additive feature that does not affect existing functionality.
Notes to Reviewers
Constants::ANSWER_TYPE_SECTIONon backend,ANSWER_TYPE_SECTIONon frontend)Related Issues
This PR implements the section functionality as requested in the technical specification.