Skip to content

Display server validation field errors inline in forms#126

Draft
Copilot wants to merge 3 commits intofix-validation-errorsfrom
copilot/update-ui-validation-error-display
Draft

Display server validation field errors inline in forms#126
Copilot wants to merge 3 commits intofix-validation-errorsfrom
copilot/update-ui-validation-error-display

Conversation

Copy link
Copy Markdown
Contributor

Copilot AI commented Apr 15, 2026

When the server returns a VALIDATION_ERROR (HTTP 400), the UI now shows per-field error messages in the third column of the form table (red, bold) in addition to the existing status-area message.

Changes

browser2/js/src/markup.js

  • crud.create / crud.update: Extract field_errors from VALIDATION_ERROR responses; always include field_errors: {} in all return objects (clears errors on success/network error)
  • createFormElement: After rendering each field row, append a span.field-error with the field's error message if currentState.field_errors[fieldKey] is set

browser2/js/src/style.css

  • Added .field-error { color: red; font-weight: bold; }

Page spec state defaults

  • builtin-mapp-model.jsoncreate_model_state: added field_errors: {}
  • builtin-mapp-model-instance.jsonmodel_instance: added field_errors: {}

Both are required so the lingo state type system accepts field_errors as a valid struct field when CRUD responses set it. Field errors are cleared automatically on successful create/update.

Tests (templates/mapp-py/tests/crud.spec.js, templates/sosh-net/tests/crud.spec.js)

Added test validation errors are displayed in form: mocks a VALIDATION_ERROR POST response with field_errors, submits the form, and asserts both the status message and .field-error span are visible with the correct content.

Example response handled

{
  "error": {
    "code": "VALIDATION_ERROR",
    "message": "This model has failed validation",
    "field_errors": {
      "x_bool": "Must be a boolean value",
      "x_int": "Must be an integer"
    }
  }
}

Each key in field_errors maps to its form row's third column; fields without an entry show their description as before.

Copilot AI linked an issue Apr 15, 2026 that may be closed by this pull request
Copilot AI changed the title [WIP] Update UI to display validation error response from server Display server validation field errors inline in forms Apr 15, 2026
Copilot AI requested a review from b-rad-c April 15, 2026 06:00
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Validation Error Handling

2 participants