title: Expect following JSON(mention in image) as output using react-admin framework
body: <p><a href="https://i.stack.imgur.com/0w0gA.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/0w0gA.png" alt="Expect this JSON as output" /></a></p>
  <p>Below is the my code or react component:-</p>
  <pre><code>import { Box } from '@material-ui/core';
  import React,{ useEffect, useState } from 'react'
  import {
      Create,
      SimpleForm,
      TextInput,
      TextField,
      ArrayInput,
      SimpleShowLayout,
      SimpleFormIterator,
      RadioButtonGroupInput,TopToolbar
     
  } from 'react-admin'
  
  import &quot;../index.css&quot;
  const JobCreate = (props) =&gt; {
  
      const types = [
          {id:'default'},
          {id:'custom'}
      ];
  
      const [checked,setChecked] = useState(true);
      
      const onClickType = (id) =&gt; {
          (id === &quot;custom&quot;) ? setChecked(false) : setChecked(true)
      }
  
      return (
          &lt;Create title='Create an Job' {...props}&gt;
              &lt;SimpleForm&gt;
                  &lt;TextInput source='source' /&gt;
                  &lt;TextInput source='destination' /&gt;
                  
                  &lt;RadioButtonGroupInput label=&quot;Type&quot;
                                         source=&quot;custom&quot;
                                         choices={types}
                                         optionText=&quot;id&quot;
                                         onChange={onClickType} /&gt;
  
                  &lt;RadioButtonGroupInput source=&quot;category&quot; choices={[
                      { id: 'default', name: 'default' },
                      { id: 'custom', name: 'custom' },
                      
                  ]} /&gt;
                  
                  {!checked &amp;&amp; ( 
                      &lt;SimpleShowLayout source=&quot;video&quot;&gt;
                          &lt;TextInput label='voice' name=&quot;codec&quot; required /&gt;
                      &lt;/SimpleShowLayout&gt;
                  )}
  
                  { !checked &amp;&amp; (
                    
                      &lt;ArrayInput source=&quot;Profiles&quot;&gt;
                          &lt;SimpleFormIterator disableReordering&gt;
                              &lt;TextInput  label='Name' source=&quot;Name&quot; required /&gt;
                              &lt;TextInput label='Profile' source=&quot;profile&quot; required /&gt;
                          &lt;/SimpleFormIterator&gt;
                      &lt;/ArrayInput&gt;
                     
                  )}
  
                  {!checked &amp;&amp; (
                      &lt;SimpleShowLayout source=&quot;audios&quot;&gt;
                          &lt;TextInput label='audio1'  required /&gt;
                          &lt;TextInput label='audio2'  required /&gt;
                      &lt;/SimpleShowLayout&gt;&lt;/source&gt;
                  )}        
              &lt;/SimpleForm&gt;
          &lt;/Create&gt;
     )
  }
  
  export default JobCreate
  </code></pre>
  <p>I want to create complex UI using the react-admin framework, I have created the UI but when hit the save button, not getting actual or expected JSON in the output while sending to the api.
  I tried so many ways, but no luck, Hence posting this question.</p>
  <p>Here is the documentation link : <a href="https://marmelab.com/react-admin/Readme.html" rel="nofollow noreferrer">https://marmelab.com/react-admin/Readme.html</a></p>