[SOLVED] Trying to add records to zoho creator from a html web page

Trying to add records to zoho creator from a html web page

I'm trying to connect a html page with zoho creator. I defined a Email and phone number field in the html page. So when my form is submitted in the form it should be added to the zoho creator records. When I tried this in the post man it worked, but in the web page it doesn't. This is the html I created:

<!DOCTYPE html>
<html>
<head>
  <title>Zoho Creator Add Record Form</title>
</head>
<body>
  <h1>Zoho Creator Add Record Form</h1>

  <form action="https://creator.zoho.in/api/v2/myaccount name/my application name/form/myform name" method="POST">
    <input type="hidden" name="application name" value="application name">
    <input type="hidden" name="form name " value="form name">
    <input type="hidden" name="Zoho-oauthtoken" value="Zoho-oauthtoken .xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx">

    <label for="Email">Email:</label>
    <input type="email" name="Email" id="Email">

    <label for="Phone_Number">Phone:</label>
    <input type="tel" name="Phone_Number" id="Phone_Number">

    <input type="submit" value="Add Record">
  </form>
</body>
</html>

Error I'm facing:

{
    "code": 2945,
    "description": "JSON_PARSE_ERROR"
}

Solution

As the error message implies, and the documentation says: The body of the HTTP request needs to be JSON.

You are sending Form URL Encoded data. You can’t send JSON with a regular HTML form.

You’d need to write JavaScript to pull the data out of the form, construct the data structure, encode it as JSON, and then POST it using Ajax (typically the fetch API).

That assumes the API uses CORS to permit direct access from browsers.