Symfony Json Form Laravel Package

Getting Started

Minimal Setup

1. Installation

   composer require drjele/symfony-json-form
   

   Ensure your project uses Symfony 5.4+ or Laravel with Symfony components (e.g., via symfony/http-foundation).

2. Basic Form Creation Define a form class extending JsonFormType:

   use DrJele\JsonForm\JsonFormType;
   
   class UserForm extends JsonFormType
   {
       public function buildForm(BuilderInterface $builder, array $options)
       {
           $builder
               ->add('name', TextType::class)
               ->add('email', EmailType::class);
       }
   }
   

3. First Use Case: API Response Use the form in a controller to return JSON-serialized form data:

   use DrJele\JsonForm\JsonFormFactory;
   
   public function getForm(JsonFormFactory $factory)
   {
       $form = $factory->create(UserForm::class);
       return response()->json($form->toJson());
   }
   

4. Frontend Integration Consume the JSON output in a frontend framework (e.g., React/Vue) to render dynamic forms.

Implementation Patterns

Workflow: Form Submission

1. Client-Side Send JSON payload from frontend:

   {
       "data": {
           "name": "John Doe",
           "email": "john@example.com"
       }
   }
   

2. Server-Side Handling

   public function submitForm(Request $request, JsonFormFactory $factory)
   {
       $form = $factory->create(UserForm::class);
       $form->submit(json_decode($request->json()->getContent(), true));
   
       if ($form->isValid()) {
           $data = $form->getData();
           // Save to DB or process
       }
       return response()->json($form->toJson());
   }
   

Integration with Laravel

• Service Provider Bind the factory in AppServiceProvider:

  public function register()
  {
      $this->app->bind(JsonFormFactory::class, function ($app) {
          return new JsonFormFactory();
      });
  }
  

• Validation Leverage Symfony’s validation constraints:

  $builder->add('email', EmailType::class, [
      'constraints' => [new NotBlank(), new Email()]
  ]);
  

Dynamic Forms

Use JsonFormType to build dynamic forms based on runtime data:

$builder->add('dynamic_field', TextType::class, [
    'required' => $someCondition,
    'label' => 'Dynamic Label'
]);

Gotchas and Tips

Pitfalls

1. JSON Schema Mismatch

   • Ensure frontend payload matches the form’s expected structure. Use $form->toJson() to debug schema.
   • Example error: Missing or extra fields in the submitted JSON.

2. Validation Errors

   • Symfony’s validation errors are returned in the JSON response. Handle them in the frontend:

     {
         "errors": {
             "email": ["This value should not be blank."]
         }
     }
     

3. CSRF Protection

   • Disable CSRF for API routes if using JSON forms (Laravel’s VerifyCsrfToken middleware may interfere):

     Route::middleware('api')->group(function () {
         // JSON form routes
     });
     

Debugging Tips

• Dump Form Data Use dd($form->getData()) or dd($form->toJson()) to inspect form state.
• Validation Groups Specify validation groups in the form type:

  $builder->add('field', TextType::class, [
      'validation_groups' => ['group1', 'group2']
  ]);
  

Extension Points

1. Custom JSON Serialization Override toJson() in a custom form class:

   public function toJson()
   {
       $data = parent::toJson();
       $data['custom_field'] = $this->getCustomValue();
       return $data;
   }
   

2. Frontend-Specific Logic Add frontend-specific metadata:

   $builder->add('field', TextType::class, [
       'attr' => ['frontend_type' => 'autocomplete']
   ]);
   

3. Event Listeners Use Symfony events (e.g., PRE_SUBMIT) to modify form data:

   $dispatcher->addFormTypeSubscriber(new class implements FormEventSubscriberInterface {
       public function getSubscribedEvents()
       {
           return [FormEvents::PRE_SUBMIT];
       }
       public function onFormPreSubmit(FormEvent $event)
       {
           $data = $event->getData();
           $data['processed'] = true;
           $event->setData($data);
       }
   });
   

Configuration Quirks

• Default Options Set default options in the form type constructor:

  public function __construct()
  {
      $this->addModelTransformer(new JsonModelTransformer());
  }
  

• Localization Use Symfony’s translation system for form labels/errors:

  $builder->add('name', TextType::class, [
      'translation_domain' => 'forms'
  ]);