Fix highlight error for fields on modal and admin view and add autocomplete for city

Signed-off-by: Fabio Teixeira <fabio1079@gmail.com> Signed-off-by: Gabriela Navarro <navarro1703@gmail.com>

Fix highlight error for fields on modal and admin view and add autocomplete for city
Signed-off-by: Fabio Teixeira <fabio1079@gmail.com> Signed-off-by: Gabriela Navarro <navarro1703@gmail.com>
Gabriela Navarro · Fabio Teixeira
1 parent f6b472cd
Showing 4 changed files with 155 additions and 43 deletions Show diff stats
controllers/gov_user_plugin_controller.rb
lib/gov_user_plugin.rb
public/views/create-institution.js
views/gov_user_plugin/_institution.html.erb
@@ -15,6 +15,9 @@ class GovUserPluginController &lt; ApplicationController
   def create_institution
     @show_sisp_field = environment.admins.include?(current_user.person)
     @state_list = get_state_list()
+    @governmental_sphere = [[_("Select a Governmental Sphere"), 0]]|GovernmentalSphere.all.map {|s| [s.name, s.id]}
+    @governmental_power = [[_("Select a Governmental Power"), 0]]|GovernmentalPower.all.map {|g| [g.name, g.id]}
+    @juridical_nature = [[_("Select a Juridical Nature"), 0]]|JuridicalNature.all.map {|j| [j.name, j.id]}
     params[:community] ||= {}
     params[:institutions] ||= {}
@@ -40,6 +43,9 @@ class GovUserPluginController &lt; ApplicationController
   def create_institution_admin
     @show_sisp_field = environment.admins.include?(current_user.person)
     @state_list = get_state_list()
+    @governmental_sphere = [[_("Select a Governmental Sphere"), 0]]|GovernmentalSphere.all.map {|s| [s.name, s.id]}
+    @governmental_power = [[_("Select a Governmental Power"), 0]]|GovernmentalPower.all.map {|g| [g.name, g.id]}
+    @juridical_nature = [[_("Select a Juridical Nature"), 0]]|JuridicalNature.all.map {|j| [j.name, j.id]}
     @url_token = split_http_referer request.original_url()
@@ -205,9 +211,10 @@ class GovUserPluginController &lt; ApplicationController
   end
   def save_institution institution
+    inst_errors = institution.errors.messages
+    com_errors = institution.community.errors.messages
-    inst_errors = institution.errors.full_messages
-    com_errors = institution.community.errors.full_messages
+    set_errors institution
     set_error_css institution
@@ -219,7 +226,7 @@ class GovUserPluginController &lt; ApplicationController
     else
       { :success => false,
         :message => _("Institution could not be created!"),
-        :errors => inst_errors << com_errors
+        :errors => inst_errors.merge(com_errors)
       }
     end
   end
@@ -229,23 +236,24 @@ class GovUserPluginController &lt; ApplicationController
       redirect_to :controller => "/admin_panel", :action => "index"
     else
       flash[:errors] = response_message[:errors]
-      redirect_to :controller => "gov_user_plugin", :action => "create_institution_admin", :params => params
+
+      redirect_to :controller => "gov_user_plugin", :action => "create_institution_admin"
     end
   end
-  def set_error_css institution
-    institution.valid?
-    institution.community.valid?
-    params[:error_community_name] = institution.community.errors.include?(:name) ? "highlight-error" : ""
-    params[:error_community_country] = institution.community.errors.include?(:country) ? "highlight-error" : ""
-    params[:error_community_city] = institution.errors.include?(:city) ? "highlight-error" : ""
-    params[:error_community_state] = institution.errors.include?(:state) ? "highlight-error" : ""
-    params[:error_institution_corporate_name] = institution.errors.include?(:corporate_name) ? "highlight-error" : ""
-    params[:error_institution_acronym] = institution.errors.include?(:acronym) ? "highlight-error" : ""
-    params[:error_institution_cnpj] = institution.errors.include?(:cnpj) ? "highlight-error" : ""
-    params[:error_institution_governmental_sphere] = institution.errors.include?(:governmental_sphere) ? "highlight-error" : ""
-    params[:error_institution_governmental_power] = institution.errors.include?(:governmental_power) ? "highlight-error" : ""
-    params[:error_institution_juridical_nature] = institution.errors.include?(:juridical_nature) ? "highlight-error" : ""
-    params[:error_institution_sisp] = institution.errors.include?(:sisp) ? "highlight-error" : ""
+  def set_errors institution
+    institution.valid? if institution
+    institution.community.valid? if institution.community
+
+    flash[:error_community_name] = institution.community.errors.include?(:name) ? "highlight-error" : ""
+    flash[:error_community_country] = institution.errors.include?(:country) ? "highlight-error" : ""
+    flash[:error_community_state] = institution.errors.include?(:state) ? "highlight-error" : ""
+    flash[:error_community_city] = institution.errors.include?(:city) ? "highlight-error" : ""
+    flash[:error_institution_corporate_name] = institution.errors.include?(:corporate_name) ? "highlight-error" : ""
+    flash[:error_institution_cnpj] = institution.errors.include?(:cnpj) ? "highlight-error" : ""
+    flash[:error_institution_governmental_sphere] = institution.errors.include?(:governmental_sphere) ? "highlight-error" : ""
+    flash[:error_institution_governmental_power] = institution.errors.include?(:governmental_power) ? "highlight-error" : ""
+    flash[:error_institution_juridical_nature] = institution.errors.include?(:juridical_nature) ? "highlight-error" : ""
   end
+
 end
@@ -124,6 +124,23 @@ class GovUserPlugin &lt; Noosfero::Plugin
     percentege
   end
+  def stylesheet?
+    true
+  end
+
+  def admin_panel_links
+    [
+      {
+        :title => _('Create Institution'),
+        :url => {
+            :controller => 'gov_user_plugin',
+            :action => 'create_institution_admin'
+          }
+      }
+    ]
+  end
+
+
   def js_files
     %w(
     vendor/modulejs-1.5.0.min.js
@@ -9,7 +9,9 @@ modulejs.define(&#39;CreateInstitution&#39;, [&#39;jquery&#39;, &#39;NoosferoRoot&#39;, &#39;SelectElement&#39;]
     institution_already_exists:
       NoosferoRoot.urlWithSubDirectory("/plugin/gov_user/institution_already_exists"),
     get_institutions:
-      NoosferoRoot.urlWithSubDirectory("/plugin/gov_user/get_institutions")
+      NoosferoRoot.urlWithSubDirectory("/plugin/gov_user/get_institutions"),
+    auto_complete_city:
+      NoosferoRoot.urlWithSubDirectory("/account/search_cities")
   };
@@ -96,19 +98,49 @@ modulejs.define(&#39;CreateInstitution&#39;, [&#39;jquery&#39;, &#39;NoosferoRoot&#39;, &#39;SelectElement&#39;]
       $(".remove-institution").click(remove_institution);
     } else {
-      var errors = "<ul>";
+      var errors = create_error_list(response);
+      $("#create_institution_errors").switchClass("hide-field", "show-field").html("<h2>"+response.message+"</h2>"+errors);
-      for(var i = 0; i < response.errors.length; i++) {
-        errors += "<li>"+response.errors[i]+"</li>";
-      }
-      errors += "</ul>";
-      if($('#institution_dialog') == 0){
-        $('#create_institution_errors').switchClass("show-field", "hide-field");
-        $('#errorExplanation').html("<h2>"+response.message+"</h2>"+errors);
-      }else{
-        $("#create_institution_errors").switchClass("hide-field", "show-field").html("<h2>"+response.message+"</h2>"+errors);
+      show_errors_in_each_field(response.errors);
+    }
+  }
+
+  function create_error_list(response){
+    var errors = "<ul>";
+    var field_name;
+
+    for(var error_key in response.errors) {
+      field_name = adjust_error_key(error_key);
+
+      if(response.errors[error_key].length > 0){
+        errors += "<li><b>"+field_name+"</b>: "+response.errors[error_key]+"</li>";
       }
     }
+
+    errors += "</ul>";
+    return errors;
+  }
+
+
+  function show_errors_in_each_field(errors) {
+    var error_keys = Object.keys(errors);
+
+    // (field)|(field)|...
+    var verify_error = new RegExp("(" + error_keys.join(")|(") + ")" );
+
+    var fields_with_errors = $("#institution_dialog .formfield input").filter(function(index, field) {
+      return verify_error.test(field.getAttribute("name"));
+    });
+
+    fields_with_errors.addClass("highlight-error");
+  }
+
+
+  function adjust_error_key(error_key) {
+    var text = error_key.replace(/_/, " ");
+    text = text.charAt(0).toUpperCase() + text.slice(1);
+
+    return text;
   }
@@ -306,6 +338,41 @@ modulejs.define(&#39;CreateInstitution&#39;, [&#39;jquery&#39;, &#39;NoosferoRoot&#39;, &#39;SelectElement&#39;]
     }
   }
+  function autoCompleteCity() {
+    var country_selected = $('#community_country').val()
+
+    if(country_selected == "BR")
+    {
+      $('#community_city').autocomplete({
+        source : function(request, response){
+          $.ajax({
+            type: "GET",
+            url: AJAX_URL.auto_complete_city,
+            data: {city_name: request.term, state_name: $("#community_state").val()},
+            success: function(result){
+              response(result);
+
+              // There are two autocompletes in this page, the last one is modal
+              // autocomplete just put it above the modal
+              $(".ui-autocomplete").last().css("z-index", 1000);
+            },
+            error: function(ajax, stat, errorThrown) {
+              console.log('Link not found : ' + errorThrown);
+            }
+          });
+        },
+
+        minLength: 3
+      });
+    }
+    else
+    {
+      if ($('#community_city').data('autocomplete')) {
+        $('#community_city').autocomplete("destroy");
+        $('#community_city').removeData('autocomplete');
+      }
+    }
+  }
   function set_events() {
     $("#create_institution_link").click(open_create_institution_modal);
@@ -330,6 +397,11 @@ modulejs.define(&#39;CreateInstitution&#39;, [&#39;jquery&#39;, &#39;NoosferoRoot&#39;, &#39;SelectElement&#39;]
     add_mask_to_form_items();
     institution_autocomplete();
+
+    autoCompleteCity();
+    $('#community_country').change(function(){
+      autoCompleteCity();
+    })
   }
@@ -10,8 +10,11 @@
 <div class="errorExplanation" id="errorExplanation">
   <h2> <%= _("Can`t create new Institution: #{flash[:errors].length} errors") %> </h2>
   <ul>
-  <% flash[:errors].each do |error| %>
-    <li> <%= error %> </li>
+  <% flash[:errors].each do |key, value| %>
+    <% key_name = key.to_s.gsub("_", " ") %>
+    <% if value.length > 0 %>
+      <li> <%= _("<b>#{key_name.capitalize}</b> #{value.join()}") %> </li>
+    <% end %>
   <% end %>
   </ul>
 </div>
@@ -20,6 +23,10 @@
 <div id = 'create_institution_errors' class='errorExplanation hide-field'></div>
 <div>
+  <div class="fields-required">
+    <span class="errorExplanation"><%= required_fields_message %></span>
+  </div>
+  <br/>
   <%= labelled_form_for :community, :url => {:action=>"new_institution"}, :html => { :multipart => true, :id=>"institution_form" } do |f| %>
     <div class="fields-required">
       <span class="errorExplanation"><%= required_fields_message %></span>
@@ -39,7 +46,8 @@
             </label>
           </div>
         </span>
-      <%= required f.text_field(:name, :value => params[:community][:name], :size => 55, :class => "#{params[:error_community_name]}" ) %>
+
+      <%= required f.text_field(:name, :class => flash[:error_community_name]) %>
       <%= content_tag :span, _("Institution name already exists"), :id=>"already_exists_text", :class=>"errorExplanation hide-field" %>
       <div class= <%= @error_corporate_name %> >
@@ -53,49 +61,56 @@
       <span class='optional-field'>
         <div class="formfield type-text">
-          <%= hidden_field_tag "acronym_translate", _("Acronym") %>
-          <%= hidden_field_tag "fantasy_name_translate", _("Fantasy name") %>
-          <%= inst.label("acronym" ,_("Acronym"), :class=>"formlabel") %>
-          <%= inst.text_field(:acronym, :value => params[:institutions][:acronym], :class => "#{params[:error_institution_acronym]}") %>
+          <%= inst.label "corporate_name", _("Corporate Name"), :class=>"formlabel" %>
+          <%= required inst.text_field(:corporate_name, :class => flash[:error_institution_corporate_name]) %>
         </div>
       </span>
-      <%= required select_country(_('Country'), 'community', 'country', {:class => "type-select #{params[:error_community_country]}", :id => "community_country"}) %>
+      <%= required select_country(_('Country'), 'community', 'country', {:class => "type-select #{flash[:error_community_country]}", :id => "community_country"}) %>
       <span class='required-field'>
         <div class="formfield">
           <label for="community_state" class="formlabel"><%= _("State") %></label>
-          <%= f.select(:state, @state_options, :selected => params[:community][:state], :class => "#{params[:error_community_state]}") %>
+          <%= f.select(:state, @state_list.collect {|state| [state.name, state.name]}, {}, {:class => flash[:error_community_state]}) %>
         </div>
       </span>
-      <%= required f.text_field(:city, :value => params[:community][:city], :id => "city_field", :class => "#{params[:error_community_city]}") %>
+      <%= required f.text_field(:city, :class => flash[:error_community_city]) %>
       <span class='required-field'>
         <div class="formfield type-text">
           <%= inst.label("cnpj" ,_("CNPJ"), :class=>"formlabel") %>
-          <%= required inst.text_field(:cnpj, :value => params[:institutions][:cnpj], :placeholder=>"99.999.999/9999-99", :class=>"intitution_cnpj_field #{params[:error_institution_cnpj]}") %>
+          <%= required inst.text_field(:cnpj, :placeholder=>"99.999.999/9999-99", :class=>"intitution_cnpj_field #{flash[:error_institution_cnpj]}") %>
+        </div>
+      </span>
+
+      <span class='optional-field'>
+        <div class="formfield type-text">
+          <%= hidden_field_tag "acronym_translate", _("Acronym") %>
+          <%= hidden_field_tag "fantasy_name_translate", _("Fantasy name") %>
+          <%= inst.label("acronym" ,_("Acronym"), :class=>"formlabel") %>
+          <%= inst.text_field(:acronym) %>
         </div>
       </span>
       <span class='required-field public-institutions-fields'>
         <div class="formfield type-text">
           <%= inst.label("governmental_sphere_id" ,_("Governmental Sphere:"), :class=>"formlabel") %>
-          <%= inst.select(:governmental_sphere, @governmental_sphere_options, :selected => params[:institutions][:governmental_sphere], :class => "#{params[:error_institution_governmental_sphere]}" )%>
+          <%= inst.select(:governmental_sphere, @governmental_sphere, {:selected=>0})%>
         </div>
       </span>
       <span class='required-field public-institutions-fields'>
         <div class="formfield type-text">
           <%= inst.label("governmental_power_id" ,_("Governmental Power:"), :class=>"formlabel") %>
-          <%= inst.select(:governmental_power, @governmental_power_options, :selected => params[:institutions][:governmental_power], :class => "#{params[:error_institution_governmental_power]}")%>
+          <%= inst.select(:governmental_power, @governmental_power, {:selected=>0})%>
         </div>
       </span>
       <span class='required-field public-institutions-fields'>
         <div class="formfield type-text">
           <%= inst.label("juridical_nature_id" ,_("Juridical Nature:"), :class=>"formlabel") %>
-          <%= inst.select(:juridical_nature, @juridical_nature_options, :selected => params[:institutions][:juridical_nature], :class => "#{params[:error_institution_juridical_nature]}")%>
+          <%= inst.select(:juridical_nature, @juridical_nature, {:selected=>0})%>
         </div>
       </span>
	@@ -124,6 +124,23 @@ class GovUserPlugin < Noosfero::Plugin		@@ -124,6 +124,23 @@ class GovUserPlugin < Noosfero::Plugin
124	percentege	124	percentege
125	end	125	end
126		126
		127	+ def stylesheet?
		128	+ true
		129	+ end
		130	+
		131	+ def admin_panel_links
		132	+ [
		133	+ {
		134	+ :title => _('Create Institution'),
		135	+ :url => {
		136	+ :controller => 'gov_user_plugin',
		137	+ :action => 'create_institution_admin'
		138	+ }
		139	+ }
		140	+ ]
		141	+ end
		142	+
		143	+
127	def js_files	144	def js_files
128	%w(	145	%w(
129	vendor/modulejs-1.5.0.min.js	146	vendor/modulejs-1.5.0.min.js
	@@ -9,7 +9,9 @@ modulejs.define('CreateInstitution', ['jquery', 'NoosferoRoot', 'SelectElement']		@@ -9,7 +9,9 @@ modulejs.define('CreateInstitution', ['jquery', 'NoosferoRoot', 'SelectElement']
9	institution_already_exists:	9	institution_already_exists:
10	NoosferoRoot.urlWithSubDirectory("/plugin/gov_user/institution_already_exists"),	10	NoosferoRoot.urlWithSubDirectory("/plugin/gov_user/institution_already_exists"),
11	get_institutions:	11	get_institutions:
12	- NoosferoRoot.urlWithSubDirectory("/plugin/gov_user/get_institutions")	12	+ NoosferoRoot.urlWithSubDirectory("/plugin/gov_user/get_institutions"),
		13	+ auto_complete_city:
		14	+ NoosferoRoot.urlWithSubDirectory("/account/search_cities")
13	};	15	};
14		16
15		17
	@@ -96,19 +98,49 @@ modulejs.define('CreateInstitution', ['jquery', 'NoosferoRoot', 'SelectElement']		@@ -96,19 +98,49 @@ modulejs.define('CreateInstitution', ['jquery', 'NoosferoRoot', 'SelectElement']
96		98
97	$(".remove-institution").click(remove_institution);	99	$(".remove-institution").click(remove_institution);
98	} else {	100	} else {
99	- var errors = "<ul>";	101	+ var errors = create_error_list(response);
		102	+ $("#create_institution_errors").switchClass("hide-field", "show-field").html("<h2>"+response.message+"</h2>"+errors);
100		103
101	- for(var i = 0; i < response.errors.length; i++) {
102	- errors += "<li>"+response.errors[i]+"</li>";
103	- }
104	- errors += "</ul>";
105	- if($('#institution_dialog') == 0){
106	- $('#create_institution_errors').switchClass("show-field", "hide-field");
107	- $('#errorExplanation').html("<h2>"+response.message+"</h2>"+errors);
108	- }else{
109	- $("#create_institution_errors").switchClass("hide-field", "show-field").html("<h2>"+response.message+"</h2>"+errors);	104	+ show_errors_in_each_field(response.errors);
		105	+ }
		106	+ }
		107	+
		108	+ function create_error_list(response){
		109	+ var errors = "<ul>";
		110	+ var field_name;
		111	+
		112	+ for(var error_key in response.errors) {
		113	+ field_name = adjust_error_key(error_key);
		114	+
		115	+ if(response.errors[error_key].length > 0){
		116	+ errors += "<li><b>"+field_name+"</b>: "+response.errors[error_key]+"</li>";
110	}	117	}
111	}	118	}
		119	+
		120	+ errors += "</ul>";
		121	+ return errors;
		122	+ }
		123	+
		124	+
		125	+ function show_errors_in_each_field(errors) {
		126	+ var error_keys = Object.keys(errors);
		127	+
		128	+ // (field)\|(field)\|...
		129	+ var verify_error = new RegExp("(" + error_keys.join(")\|(") + ")" );
		130	+
		131	+ var fields_with_errors = $("#institution_dialog .formfield input").filter(function(index, field) {
		132	+ return verify_error.test(field.getAttribute("name"));
		133	+ });
		134	+
		135	+ fields_with_errors.addClass("highlight-error");
		136	+ }
		137	+
		138	+
		139	+ function adjust_error_key(error_key) {
		140	+ var text = error_key.replace(/_/, " ");
		141	+ text = text.charAt(0).toUpperCase() + text.slice(1);
		142	+
		143	+ return text;
112	}	144	}
113		145
114		146
	@@ -306,6 +338,41 @@ modulejs.define('CreateInstitution', ['jquery', 'NoosferoRoot', 'SelectElement']		@@ -306,6 +338,41 @@ modulejs.define('CreateInstitution', ['jquery', 'NoosferoRoot', 'SelectElement']
306	}	338	}
307	}	339	}
308		340
		341	+ function autoCompleteCity() {
		342	+ var country_selected = $('#community_country').val()
		343	+
		344	+ if(country_selected == "BR")
		345	+ {
		346	+ $('#community_city').autocomplete({
		347	+ source : function(request, response){
		348	+ $.ajax({
		349	+ type: "GET",
		350	+ url: AJAX_URL.auto_complete_city,
		351	+ data: {city_name: request.term, state_name: $("#community_state").val()},
		352	+ success: function(result){
		353	+ response(result);
		354	+
		355	+ // There are two autocompletes in this page, the last one is modal
		356	+ // autocomplete just put it above the modal
		357	+ $(".ui-autocomplete").last().css("z-index", 1000);
		358	+ },
		359	+ error: function(ajax, stat, errorThrown) {
		360	+ console.log('Link not found : ' + errorThrown);
		361	+ }
		362	+ });
		363	+ },
		364	+
		365	+ minLength: 3
		366	+ });
		367	+ }
		368	+ else
		369	+ {
		370	+ if ($('#community_city').data('autocomplete')) {
		371	+ $('#community_city').autocomplete("destroy");
		372	+ $('#community_city').removeData('autocomplete');
		373	+ }
		374	+ }
		375	+ }
309		376
310	function set_events() {	377	function set_events() {
311	$("#create_institution_link").click(open_create_institution_modal);	378	$("#create_institution_link").click(open_create_institution_modal);
	@@ -330,6 +397,11 @@ modulejs.define('CreateInstitution', ['jquery', 'NoosferoRoot', 'SelectElement']		@@ -330,6 +397,11 @@ modulejs.define('CreateInstitution', ['jquery', 'NoosferoRoot', 'SelectElement']
330	add_mask_to_form_items();	397	add_mask_to_form_items();
331		398
332	institution_autocomplete();	399	institution_autocomplete();
		400	+
		401	+ autoCompleteCity();
		402	+ $('#community_country').change(function(){
		403	+ autoCompleteCity();
		404	+ })
333	}	405	}
334		406
335		407