Freeform JSON Schema selector

Currently, I am working with JSON Schema and have a selection field with enumeration options. However, I would like to allow the user to input values manually if their desired value is not present in the selection.

{
  '$id': 'https://example.com/person.schema.json',
  '$schema': 'http://json-schema.org/draft-07/schema#',
  title: '',
  type: 'object',
  required: [],
  properties: {
    Animals: {
      type: 'string',
      enum: [
        'fox',
        ' duck'
      ],
      title: 'Animals',
      span: 6
    }
  }
}

I want to provide users with the ability to enter values such as horse.

typescriptjsonschema

Answer №1

Implementing this feature using JSON Schema is not feasible. It falls under the domain of your frontend application. JSON Schema's main function is to validate data based on predefined schemas. Allowing users to alter these schemas would undermine the very purpose of using a schema for validation.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Is it feasible to access and modify local files within an Angular project using TypeScript code in the angular component.ts file? If so, how can this be achieved?

My Angular application is built on version 4 or higher. I have a setup in my project where there is a folder containing a txt file and another folder next to it with an angular component.ts file: FolderWithFile -----file.txt ComponentFolder -----person.co ...

angularfiletypescript

Working with Files in TypeScript

New to TypeScript and seeking a command to eliminate the file path and extension. For example, if my file is located at ./data/input/myfile.js, how can I extract only "myfile" without the path and extension? ...

node.jstypescript

Encountering `No provider for ControlContainer!` error while utilizing [class.someClass] in Angular 2?

I have a project in progress which involves using angular 2. I am currently working on forms and validation and have encountered an issue. Although I have found a workaround, I am curious to understand why my original code is not functioning properly. Bel ...

javascriptformstypescriptangular

Guide to writing a unit test for a parameter decorator in NestJs

I want to implement a unit test for a basic custom decorator that I created, but I'm facing some challenges. This decorator was developed based on the solution provided here. I have Keycloak authentication set up and using this solution in my controll ...

javascripttypescriptunit-testingnestjs

TypeScript Partial of Union raises an error when trying to assign a value that belongs to a union

My goal is to develop TypeScript interfaces for a query object. interface Comparison { op: '=' | '>' | '<'; field: string; value: any; } interface Conjunction { op: 'and' | 'or'; ...

typescript

When attempting to add mp3 files to a Vue/TypeScript application, a "Module not found" error is triggered

I am encountering an error while trying to import .mp3 files into my Vue/Typescript app. Upon running 'npm serve', I am presented with the following message: ERROR in /Users/***/***/application/src/components/Sampler.vue(80,16): 80:16 Cannot fin ...

javascripttypescriptvue.js

What is the best way to implement the trackBy function in Angular 14 with strict-mode enabled?

I am facing an issue while trying to use trackBy in angular 14 with strict-mode: true, Here is the code (which works perfectly fine in strict-mode: false) app.component.html: <div *ngFor="let item of items; index as i; trackBy: trackByFn"> ...

angulartypescript

Creating a multipart/form-data POST request in Angular2 and performing validation on the input type File

I am working on sending an image (base64) via a POST request and waiting for the response. The POST request should have a Content-Type of multipart/form-data, and the image itself should be of type image/jpg. This is what the POST request should look like ...

javascriptangulartypescriptpostangular2-forms

The detection of my query parameters is not working as expected

Creating an Angular application that dynamically loads a different login page based on the "groupId" set in the URL is my current challenge. The approach involves sending each client a unique URL containing a specific "groupId" parameter. A template is the ...

angulartypescriptangular-routing

Can a function utilize a Generic-specified type property?

function extractStringValue<T extends object, S extends keyof PickByValue<T, string>>( obj: T, key: S ): string { return obj[key]; }; The PickByValue function extracts properties of object T with values of type string. type CustomType = ...

typescript

Rxjs - Converting JSON data into a TypeScript interface

While navigating through this new environment, I encountered the need to make a Web API call. The abundance of versions and options can be overwhelming. Nevertheless, I managed to find a solution that works well. Although I understand that defining "best p ...

angulartypescriptrxjs

Typescript type cast is not parsed by Prettier

I am currently using Prettier version 1.17.1 and TypeScript 3.4.5 in combination with create-react-app. Every time I attempt to utilize the x as T syntax in TypeScript for type casting, I encounter the following error: src/Form.tsx [error] src/Form.tsx: ...

typescriptprettierreact-tsx

What is the process for generating an injected and a const object instance?

How can an instance of class A obtain a dependency on an instance of class O, while remaining a singleton for others? @injectable() class O{} // A must be single instance! @injectable() class A{ constructor(o: O){ console.log( 'is A inst ...

typescriptinversifyjs

Extracting and retrieving the value from the paramMap in Angular/JavaScript

How can we extract only the value from the router param map? Currently, the output is: authkey:af408c30-d212-4efe-933d-54606709fa32 I am interested in obtaining just the random "af408c30-d212-4efe-933d-54606709fa32" without the key "authke ...

javascriptangulartypescript

Props used in styled components are effective, although they may trigger a warning message stating, "Warning: Received `true` for a non-boolean attribute `cen`."

Caution: A non-boolean attribute "cen" received a value of "true". If you intend to render it in the DOM, provide a string instead: cen="true" or cen={value.toString()}. While using Props in Styled-Component with TypeScript and Material-UI, everything func ...

reactjstypescriptmaterial-uistyled-components

implementing dynamic visibility with ngIf directive in Angular

header.component.html <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <a href="#" class="navbar-brand">Recipe Book</a> </div> <div class="collapse na ...

angulartypescript

SystemJS could not locate the root directory for RxJS

There seems to be an issue with SystemJS loading rxjs modules on Windows, as it throws a 404 Not Found error on the rxjs directory. This problem does not occur on OSX, and all modules are up to date. GET http://localhost:8080/node_modules/rxjs/ 404 (Not F ...

javascripttypescriptnpmrxjssystemjs

The communication between Angular and Unity using SignalR for messaging is not functioning properly, as I am unable to

Trying to establish a connection between Angular and Unity has been challenging for me. I can't seem to get them to communicate with each other. My goal is to have Angular "announce" when someone enters a room, and have Unity "greet" the user enterin ...

asp.netangulartypescriptunity-game-enginesignalr

Retrieve the imported object by referencing the environment

Within my TypeScript Node application, I am looking to access the exported object that corresponds to my NODE_ENV variable. config.ts const test: { [index: string]: any } = { param1: "x", param2: { name: "John" } } const dev: { [index ...

node.jstypescript

The Vue application combined with TypeScript is displaying an empty white screen

I've enrolled in a Vue + Firestore course, but I'm attempting to use TypeScript instead of conventional JavaScript. The basic setup is complete, however, my app displays a blank page when it should be showing a simple header text from the App.vue ...

typescriptvue.js