Question 108500 in Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – formatting of chat gpt responses

I am using chat gpt api on my react application. The problem i am facing is how to format the response coming from chat gpt. If is ask it to give me a response in table format it provides weird response I used pre tag to display text and response appear in this way image attached , but I want proper table just like chat gpt, in the same way if i ask for any list of items it display as a form of paragraph not on different line so how to do proper formatting of chat gpt response.

i want proper table and list as chat gpt shows but this is how i am receiving data
this is how data is appearing when using pre tag but i want proper table

Tags:

3

Answers


  1. 0

    The response from OpenAI API is in Markdown syntax. We can use some libraries to convert markdown to html (e.g., showdown).

    For React environment, we can also use react-markdown, together with the plugin remark-gfm to render Markdown format with tables (see https://github.com/remarkjs/react-markdown#use-a-plugin for reference).

    Login or Signup to reply.
  2. 0

    You can tell ChatGPT how you want it to format its response. Try one of these prompts:

    • what are the top 10 countries in the world in terms of population? format the answer as an HTML table

    • what are the top 10 countries in the world in terms of population? format the answer as a JSON object with the keys rank, country, and population

    Login or Signup to reply.
  3. 0

    ChatGPT and OpenAI APIs can return the data in a format that works for you.
    Just add the format instruction in your prompt.

    Examples:

    Return the answer as a JSON object.

    Do you know the 10 most popular books from Stephen King? Return an array of books in a JSON object.

    ChatGPT answer:

    {
  "books": [
    {
      "title": "The Shining",
      "year": 1977,
      "description": "A horror novel about a family that moves into an isolated hotel with a dark past."
    },
    {
      "title": "It",
      "year": 1986,
      "description": "A story about a group of friends who confront a shape-shifting evil entity in their small town."
    },
    ...
  ]
}

    You can then fine-tune the result, with instructions like ordered by {something}, group by {something}

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search