title: Symfony 4 Validator with AJAX
body: <p>I would like to use the Symfony 4 Validator Component to validate my forms which I send via AJAX to my Controller.</p>
  
  <p>The Form is rendered with this method in the Controller:</p>
  
  <pre><code> /**
   * @Route("/profile", name="profile")
   */
  public function profile(Request $request){
  
      $user = $this-&gt;getUser();
  
      $form = $this-&gt;createFormBuilder($user)
          -&gt;add('email', EmailType::class)
          -&gt;add('name', TextType::class)
          -&gt;getForm();
  
      return $this-&gt;render('user/user-profile.html.twig', [
          #'user' =&gt; $user,
          'form' =&gt; $form-&gt;createView(),
      ]);
  }
  </code></pre>
  
  <p>Then I have another method for handling the post request sent via AJAX:</p>
  
  <pre><code> /**
   * Update user profile data
   *
   * @Route("/api/users/updateprofile")
   * @Security("is_granted('USERS_LIST')")
   */
  
  public function apiProfileUpdate()
  {
      $request = Request::createFromGlobals();
  
      $user = $this-&gt;getUser();
      /** @var User $user */
  
      // Is this needed?
      $form = $this-&gt;createFormBuilder($user)
          -&gt;add('email', EmailType::class)
          -&gt;add('name', TextType::class)
          -&gt;getForm();
  
      $form-&gt;handleRequest($request);
  
      if ($form-&gt;isSubmitted()) {
          if($form-&gt;isValid()) {
              $user-&gt;setName($request-&gt;request-&gt;get('name'));
              $user-&gt;setEmail($request-&gt;request-&gt;get('email'));
  
              $entityManager = $this-&gt;getDoctrine()-&gt;getManager();
              $entityManager-&gt;persist($user);
              $entityManager-&gt;flush();
              return new Response('valid');
          } else {
              return new Response('not valid');
          }
      }
  }
  </code></pre>
  
  <p>The JavaScript:</p>
  
  <pre><code>$.post('/api/users/' + method, formdata, function (response) {
          $('#updateProfileAlertTitle').text("Success!");
          $('#updateProfileAlertMessage').text(response);
          $('#updateProfileAlert').removeClass('hidden');
          $('#updateProfileAlert').removeClass('alert-danger');
          $('#updateProfileAlert').addClass('alert-success');
          $('.btn-save').button('reset');
          $('.btn-cancel').prop('disabled', false);
      });
  </code></pre>
  
  <p>The Twig:</p>
  
  <pre><code>{% block body %}
  &lt;section id="sectionProfile"&gt;
      &lt;div class="box"&gt;
          &lt;div class="box-body"&gt;
              &lt;div id="updateProfileAlert" class="alert alert-success alert-dismissible hidden"&gt;
                  &lt;button type="button" class="close" data-dismiss="alert" aria-hidden="true"&gt;×&lt;/button&gt;
                  &lt;h4 id="updateProfileAlertTitle"&gt;&lt;i class="icon fa fa-check"&gt;&lt;/i&gt; Success!&lt;/h4&gt;
                  &lt;p id="updateProfileAlertMessage"&gt;Success!&lt;/p&gt;
              &lt;/div&gt;
              {{ form_start(form, {attr: {class: 'form-horizontal', id: 'formEditProfile', autocomplete: 'disabled'}}) }}
              &lt;div class="form-group"&gt;
                  {{ form_label(form.email, 'E-Mail', {label_attr: {class: 'col-sm-2 control-label'}}) }}
                  &lt;div class="col-sm-10 col-lg-6"&gt;
                      {{ form_widget(form.email, {id: 'email', full_name: 'email', attr: {class: 'form-control', autocomplete: 'disabled'}}) }}
                  &lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="form-group"&gt;
                  {{ form_label(form.name, 'Name', {label_attr: {class: 'col-sm-2 control-label'}}) }}
                  &lt;div class="col-sm-10 col-lg-6"&gt;
                      {{ form_widget(form.name, {id: 'name',full_name: 'name', attr: {class: 'form-control', autocomplete: 'disabled'}}) }}
                  &lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="module-buttons"&gt;
                  &lt;button type="button" id="updateUserProfile" class="btn btn-primary btn-save" data-loading-text="&lt;i class='fa fa-spinner fa-spin '&gt;&lt;/i&gt; Saving"&gt;Save&lt;/button&gt;
              &lt;/div&gt;
              {{ form_end(form) }}
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/section&gt;
  </code></pre>
  
  <p>{% endblock %}</p>
  
  <p>Now I have some problems when using the Symfony Validator:</p>
  
  <p>Either Symfony says I must return something (it only returns a response if $form->isSubmitted() and/or isValid() )
  or it says that the handleRequest method expects a string (but in my case it gets NULL as value for $request).</p>
  
  <p>Do I have to use the handleRequest method in order to use the Symfony Validator and its Validation methods isValid and isSubmitted?
  Or what is the way to go? Thank you in advance and sorry for my bad english</p>