What is the best way to set a JSON string as a variable?

I am attempting to send form input data to a REST service. Currently, the format is as follows:

{
  "locationname":"test",
  "locationtype":"test",
  "address":"test"
}

However, the service is only accepting the following format:

 {
    "value": "{ locationname: test ,locationtype: test, address:test }",
 }

I have tried converting the string using the code snippet below:

const tests = JSON.parse(JSON.stringify(Form.value));

but I am unsure how to assign it to Value.

My desired result after submitting the form would be:

{
  "value":"{ locationname: test ,locationtype: test, address:test }",
}

Answer №1

Perhaps this solution aligns with your specific needs. Make sure to utilize the "modifiedJsonObject" when submitting your data.

const formData = JSON.parse('{"name":"John","age":30,"city":"New York"}');
    const formString = JSON
      .stringify(formData)
      .replace(/"/g, '');
    const modifiedData = { info: formString };
    const finalString = JSON.stringify(modifiedData);

    // finalString = '{"info":"{name:John,age:30,city:New York}"}'

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

The initial JSON array is displaying correctly, however the subsequent nested arrays are appearing as [Object, object]

I am currently utilizing a wordnik API to gather the word of the day and extract array information. However, I am encountering an issue where the nested arrays are displaying as "object, object" rather than the expected data <script src="https://ajax ...

It seems like the recent upgrade to yarn 2 has caused issues with typescript types, whereas the installation of the same project with yarn 1 was

Recently, I've been attempting to update a typescript monorepo to utilize yarn 2, but I've encountered an issue where typescript is struggling to recognize certain react props. This functionality was working fine in yarn 1.x, leading me to believ ...

Issue customizing static method of a subclass from base class

Let me illustrate a simplified example of my current code: enum Type {A, B} class Base<T extends Type> { constructor(public type: T) {} static create<T extends Type>(type: T): Base<T> { return new Base(type); } } class A exte ...

Tips for retrieving and presenting information from a JSON document in a React TypeScript application

I am struggling to display data in a list format using TypeScript. I am able to fetch the data but unable to display it properly. I am currently using map to iterate through an array of JSON objects. //json file [ { "id": "6s", ...

Utilizing React Router with the power of useCallback

My route configuration is set up as follows: const defineRoutes = (): React.ReactElement => ( <Switch> <Redirect exact from="/" to="/estimates" /> <Route exact path="/estimates" component={CostingPa ...

Exploring data retrieval from nested arrays of objects in TypeScript/Angular

I have an API that returns an object array like the example below. How can I access the nested array of objects within the JSON data to find the role with roleid = 2 when EmpId is 102 using TypeScript? 0- { EmpId: 101, EmpName:'abc' Role : ...

Implementing Bootstrap 4 validation within a modal using JSON data

I've been struggling to validate the TextBoxFor before submitting the form. Despite trying various methods, I haven't managed to make it function properly. Modal: <div class="modal fade" id="MyModal_C"> <div class="modal-dialog" st ...

Vue.js - When Property is Undefined and How to Render it in Browser

My experience with Vue has been quite puzzling. I've encountered an issue while trying to render a nested property of an object called descrizione, and although it does work, I keep receiving a warning from Vue in the console: TypeError: Cannot rea ...

Transforming Typescript Strings into ##,## Format

As I've been using a method to convert strings into ##,## format, I can't help but wonder if there's an easier way to achieve the same result. Any suggestions? return new Intl.NumberFormat('de-DE', { minimumFractionDigits: 2, max ...

Encountering errors while working with React props in typing

In my application, I am utilizing ANT Design and React with 2 components in the mix: //PARENT const Test = () => { const [state, setState] = useState([]); function onChange( pagination: TablePaginationConfig, filters: Record<string, ...

The BooleanField component in V4 no longer supports the use of Mui Icons

In my React-Admin v3 project, I had a functional component that looked like this: import ClearIcon from '@mui/icons-material/Clear' import DoneIcon from '@mui/icons-material/Done' import get from 'lodash/get' import { BooleanF ...

utilizing PHP to transform a JSON string into an array

I am facing an issue with json parsing and despite researching extensively on Stackoverflow, I cannot seem to figure out what I am doing wrong. On my website, I utilize the Facebook API to post my feed using curl, which returns a json message. I store thi ...

Create an array of objects in JavaScript using JSON data

I have fetched a collection of dictionaries from my API: The data can be retrieved in JSON format like this: [{"2020-03-11 14:00:00":10.765736766809729} ,{"2020-03-11 15:00:00":10.788090128755387}, {"2020-03-11 16:00:00":10.70594897472582}, {"2020-03-11 1 ...

Tips for converting NULL% to 0%

When running my calculatePercents() method, I am receiving NULL% instead of 0%. Upon checking my console.log, I noticed that the values being printed are shown as NULL. calculatePercents() { this.v.global.total.amount = this.v.global.cash.amount + ...

Is my approach to AsyncTask correct or am I facing an issue?

Currently, I have a class that is responsible for fetching a JSON file and then parsing it into a JSONObject. Later, this JSONObject will be converted into a List of Calendar instances that will be used in my fragment. I am new to dealing with threads and ...

Clerk Bug: The UserResource type returned by useUser() does not match the @clerk/types

When attempting to pass the user obtained from useUser(), an error occurred: The 'UserResource' type is lacking the required properties 'passkeys' and 'createPasskey' from the 'UserResource' type Upon investigating ...

Interface displaying auto-detected car types

I have a setup that looks like this: interface ValueAccessor<T> { property: keyof T; getPropertyValue: (value: any) => value; } I am trying to figure out how to define the correct type and replace the any when I want to provide a custom ...

A guide on transforming CSV data into JSON format using Vue

Hello! I have a challenge where I am retrieving data from an API using Axios, but the data is in csv format and I'm struggling to convert it into a JSON object. I've experimented with various JavaScript libraries, but none of them seem to be com ...

Obtaining a JSON reply using Ember

Exploring new possibilities with Ember js, I am eager to switch from fixtures to using an API. Below is the code I have implemented to fetch the data: App.ItemsRoute = Ember.Route.extend({ model: function() { return $.getJSON('http://som ...

The configuration object is invalid. Webpack has been initialized with a configuration object that does not conform to the API schema

I recently created a basic helloworld react app through an online course, but I encountered the following error: Invalid configuration object. Webpack has been initialized with a configuration object that does not adhere to the API schema. - configur ...