Evolution #66: Ajout de tags: sablier

src/Muzich/CoreBundle/Resources/views/Tag/tagFavoritesForm.html.twig

@@ -1,4 +1,4 @@
-<form action="{{ path('update_tag_favorites', { 'redirect' : redirect }) }}" method="post" {{ form_enctype(form) }}>
+<form name="{{ form_name }}" action="{{ path('update_tag_favorites', { 'redirect' : redirect }) }}" method="post" {{ form_enctype(form) }}>
   
   {{ form_errors(form) }}
 

src/Muzich/CoreBundle/Resources/views/Tag/tagsPrompt.html.twig

@@ -2,7 +2,7 @@
 
 <div class="tags_prompt" id="tags_prompt_{{ form_name }}">
   <span class="help">{{ 'tags.help'|trans({}, 'userui') }}</span>
-  
+    
   {% if display_specials_buttons is defined %}
     {% if display_specials_buttons == true %}
       <br />
@@ -13,6 +13,7 @@
     {% endif %}
   {% endif %}
   
+   <img id="tag_loader_{{ form_name }}" class="tag_loader" style="display: none;" src="{{ asset('/bundles/muzichcore/img/ajax-loader.gif') }}" alt="loading"/>
    <input class="tags_prompt_list" id="tags_prompt_list_{{ form_name }}" name="tags" value=""> 
 </div>
 
@@ -53,9 +54,10 @@
         
         // ici il faut faire une ajax q pour obtenir la liste
         // ou a est un tableau de strings
-        
+        $('#tag_loader_{{ form_name }}').css('display', 'block');
         $.getJSON('/app_dev.php/fr/search/tag/'+req.term, function(data) {
           responseFn( data );
+          $('#tag_loader_{{ form_name }}').css('display', 'none');
         });
       },
       minLength: 2,

src/Muzich/GroupBundle/Resources/views/Default/edit.html.twig

@@ -6,7 +6,7 @@
 
   <h2>Edition du groupe {{ group.name }}</h2>
 
-  <form action="{{ path('group_update', { 'slug': group.slug }) }}" method="post" {{ form_enctype(form) }}>
+  <form name="{{ form_name }}" action="{{ path('group_update', { 'slug': group.slug }) }}" method="post" {{ form_enctype(form) }}>
     
     {% include "MuzichGroupBundle:Form:form.html.twig" %}
 

src/Muzich/GroupBundle/Resources/views/Default/myList.html.twig

@@ -24,7 +24,7 @@
 
   <h2>Ajouter un groupe</h2>
 
-  <form action="{{ path('group_add') }}" method="post" {{ form_enctype(form_new) }}>
+  <form name="{{ form_new_name }}" action="{{ path('group_add') }}" method="post" {{ form_enctype(form_new) }}>
     
     {% include "MuzichGroupBundle:Form:form.html.twig" with { 'form': form_new, 'form_name': form_new_name } %}
 

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

@@ -10,7 +10,7 @@
       {{ 'home.add_element_box.close'|trans({}, 'navigationui') }} >>
     </a>
     
-    <form action="{{ path('element_add') }}" method="post" {{ form_enctype(add_form) }}>
+    <form 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, 
@@ -25,7 +25,7 @@
     {{ 'home.add_element'|trans({}, 'navigationui') }} >>
   </a>
 
-  <form action="{{ path('search_elements') }}" method="post" {{ form_enctype(search_form) }}>
+  <form name="{{ search_form_name }}" action="{{ path('search_elements') }}" method="post" {{ form_enctype(search_form) }}>
 
     {% include "MuzichCoreBundle:SearchElement:form.html.twig" with { 
       'form_name'               : search_form_name,

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

@@ -27,7 +27,7 @@
   
   {% if his_group or group.open %}
   
-    <form action="{{ path('element_add', {'group_slug' : group.slug}) }}" method="post" {{ form_enctype(add_form) }}>
+    <form 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 } %}
 

web/bundles/muzichcore/css/main.css

@@ -323,7 +323,6 @@ cursor: text;
 border: 1px solid #ccc;
 overflow: hidden;
 padding: 0 0 1px 3px;
-min-height:48px;
 }
 ul.tagbox li {
 margin:0;
@@ -480,4 +479,11 @@ ul.tagbox input[type="text"]:FOCUS
     color-stop(0.49, rgb(168,238,255)),
     color-stop(1, rgb(189,241,254))
   );
+}
+
+.tag_loader
+{
+  float: right;
+  margin-top: 36px;
+  margin-left: 5px;
 }

web/js/tags/jquery.tagBox.js

@@ -63,11 +63,17 @@
           input = $(this);
 
           // Ici il faut faire un ajax q pour connaitre l'id, on a que le string
+          // ajax loader gif
+          $('#tag_loader_'+options.form_name).css('display', 'block');
+          // On bloque le submit le temps de la validation du tag
+          $('form[name="'+options.form_name+'"] input[type="submit"]').attr('disabled', 'disabled');
           $.getJSON('/app_dev.php/fr/search/tagid/'+$(this).val(), function(data) {
             if (isInteger(data))
             {
               self.addTag(input.val(), data, options.form_name, false);
               input.val("");
+              $('#tag_loader_'+options.form_name).css('display', 'none');
+              $('form[name="'+options.form_name+'"] input[type="submit"]').removeAttr('disabled');
             }
           });