Evolution #90: Ajaxsification des actions

src/Muzich/CoreBundle/Controller/CoreController.php

@@ -200,7 +200,16 @@ class CoreController extends Controller
 
       if ($this->getRequest()->isXmlHttpRequest())
       {
-
+        // Récupération du li
+        $html = $this->render('MuzichCoreBundle:SearchElement:li.element.html.twig', array(
+          'element'     => $element,
+          'class_color' => 'odd'
+        ))->getContent();
+        
+        return $this->jsonResponse(array(
+          'status' => 'success',
+          'html'   => $html
+        ));
       }
       else
       {
@@ -212,7 +221,19 @@ class CoreController extends Controller
     {
       if ($this->getRequest()->isXmlHttpRequest())
       {
-        return $this->jsonResponse(array(true));
+        // Récupération des erreurs
+        $validator = $this->container->get('validator');
+        $errorList = $validator->validate($form);
+
+        foreach ($errorList as $error)
+        {
+          $errors[] = $error->getMessage();
+        }
+        
+        return $this->jsonResponse(array(
+          'status' => 'error',
+          'errors' => $errors
+        ));
       }
       else
       {

src/Muzich/CoreBundle/Resources/views/SearchElement/li.element.html.twig

@@ -0,0 +1,5 @@
+<li class="element {{ class_color }}" id="element_{{ element.id }}">
+             
+  {% include "MuzichCoreBundle:SearchElement:element.html.twig" %}
+
+</li>

src/Muzich/HomeBundle/Resources/views/Home/index.html.twig

@@ -10,7 +10,7 @@
       << {{ 'home.add_element_box.close'|trans({}, 'navigationui') }}
     </a>
     
-    <form name="{{ add_form_name }}" action="{{ path('element_add') }}" method="post" {{ form_enctype(add_form) }}>
+    <form novalidate name="{{ add_form_name }}" action="{{ path('element_add') }}" method="post" {{ form_enctype(add_form) }}>
 
       {% include "MuzichCoreBundle:Element:form.add.html.twig" with { 
         'form'          : add_form, 
@@ -18,6 +18,7 @@
       } %}
 
       <input type="submit" class="button" />
+      <img class="tag_loader" style="display: none;" src="{{ asset('/bundles/muzichcore/img/ajax-loader.gif') }}" alt="loading" />
     </form>
   </div>
 

src/Muzich/HomeBundle/Resources/views/Show/showGroup.html.twig

@@ -29,11 +29,11 @@
   
     <div id="element_add_box" style="display: none;">
   
-      <a href="#" id="element_add_close_link">
+      <a href="#" id="element_add_close_link" class="button">
         &lt;&lt; {{ 'group.add_element_box.close'|trans({}, 'navigationui') }}
       </a>
       
-      <form name="{{ add_form_name }}" action="{{ path('element_add', {'group_slug' : group.slug}) }}" method="post" {{ form_enctype(add_form) }}>
+      <form novalidate name="{{ add_form_name }}" action="{{ path('element_add', {'group_slug' : group.slug}) }}" method="post" {{ form_enctype(add_form) }}>
 
         {% include "MuzichCoreBundle:Element:form.add.html.twig" with { 'form': add_form, 'form_name': add_form_name } %}
 
@@ -42,7 +42,7 @@
       
     </div>
   
-    <a href="#" id="element_add_link">
+    <a href="#" id="element_add_link" class="button">
       {{ 'group.add_element'|trans({}, 'navigationui') }} &gt;&gt;
     </a>
     <br />

web/bundles/muzichcore/js/muzich.js

@@ -666,5 +666,41 @@ $(document).ready(function(){
       divSelect.find('select').val('network_personal');
     }
   });
+
+  // Ajout d'un element
+  
+  
+  $('form[name="add"] input[type="submit"]').live('click', function(){
+    $('form[name="add"]').find('img.tag_loader').show();
+  });
+  $('form[name="add"]').ajaxForm(function(response) {
+    $('form[name="add"] img.tag_loader').hide();
+    if (response.status == 'success')
+    {
+      $('form[name="add"]').find('ul.error_list').remove();
+      $('ul.elements').prepend(response.html);
+      $('form[name="add"] input[type="text"]').val('');
+      $('div#element_add_box').slideUp();
+      $('a#element_add_link').show();
+      if ($('form[name="search"]').length)
+      {
+        $('form[name="search"]').slideDown();
+      }
+    }
+    else if (response.status == 'error')
+    {
+      $('form[name="add"]').find('ul.error_list').remove();
+      ul_errors = $('<ul>').addClass('error_list');
+      
+      for (i in response.errors)
+      {
+        ul_errors.append($('<li>').append(response.errors[i]));
+      }
+      
+      $('form[name="add"]').prepend(ul_errors);
+    }
+    
+    return false;
+  });
    
- });
+ });