Custom field with JSON type cant be saved on the admin panel

System Information
  • Strapi Version: 4.14.4
  • Operating System: Monterey 12.3
  • Database: SQLite
  • Node Version: 16.20.2
  • NPM Version: 8.19.4
  • Yarn Version: 1.22.9

I created a custom field (a dropdown)as a plugin that fetches data from an external api, I want to use it on my collection, the data is basically an array of objects so I set it as JSON type. I assigned the component to a field and its working fine, I can fetch, select, remove the data fetched in the component but once I want to save the new record on the admin panel the save button doesn’t do anything, the lifecycle before create doesn’t trigger, I dont get any error on the vscode terminal or on the browser.

  • If I want to save a record on the same collection but with the JSON costume fields empty (saving like a normal datefield for example), the save button works.
  • Also I tried saving it with a POST from the api Strapi makes and it works, but I noticed that even If I send it as JSON the value prop in the input comes as a string, why?
  • I dont think there something wrong with the code, because If i change the type of my customField/plugin to string, the save works fine

This is the Save button im talking about

Some of the code

I dont think I have an issue where I register the customField

"use strict";

module.exports = ({ strapi }) => {
  // register phase
    name: "dropdown",
    plugin: "dropdown",
    type: "json",
      name: "dropdown",
      pluginId: "dropdown",
      type: "json",
      intlLabel: {
        id: "dropdown.dropdown.label",
        defaultMessage: "dropdown",
      intlDescription: {
        id: "dropdown.dropdown.description",
        defaultMessage: "data dropdowns",
      icon: PluginIcon,
      components: {
        Input: async () =>
            /* webpackChunkName: "input-component" */ "./components/Input"
      options: {},

the fields in the schema are this way

 "Picklist_divisions": {
      "type": "customField",
      "customField": "plugin::dropdown.dropdown"
    "Picklist_contacts": {
      "type": "customField",
      "customField": "plugin::dropdown.dropdown"

component of the plugin (customField)

export default function Index({
}) {
  console.log(value); // why this comes as string if i saved it with the strapi api as a json
// code...
return ()

the content types looks good also

Picklist_divisions: Attribute.JSON &
    Picklist_contacts: Attribute.JSON &

All JSON I believe is stored as string.

I was working on a plugin that needed to use JSON and I had to pass it as a string to work.

import React from "react";
import { JSONInput } from "@strapi/design-system";

import styled from "styled-components";

const JSONInputWrapper = styled(JSONInput)`
  width: 100%;
  /* position: absolute;
  left: 1rem;
  bottom: 1rem; */
  cursor: default;

export default function OpenStreetMapInput({
}) {
  return (
      value={JSON.stringify(marker) || value}

Hope this helps.

That worked, thanks!