Commit cee41ab2bf5af990029d746a2aafa5b6ffca2b17
Committed by
Fabio Teixeira
1 parent
9e654d48
Exists in
master
and in
5 other branches
Add javascript validation to edit user profile, change README
- Add note to add states and cities information Signed-off-by: Parley Martins <parley@outlook.com> Signed-off-by: Gustavo Jaruga <darksshades@gmail.com>
Showing
3 changed files
with
92 additions
and
52 deletions
Show diff stats
README.md
| ... | ... | @@ -21,6 +21,8 @@ Activate Plugin |
| 21 | 21 | |
| 22 | 22 | As a Noosfero administrator user, go to administrator panel: |
| 23 | 23 | |
| 24 | +- Execute the command to allow city and states to show up: | |
| 25 | + psql -U USERNAME -d NOOSFERO_DATABASE -a -f db/brazil_national_regions.sql | |
| 24 | 26 | - Click on "Enable/disable plugins" option |
| 25 | 27 | - Click on "MPOG Software Plugin" check-box |
| 26 | 28 | ... | ... |
public/mpog-user-validations.js
| ... | ... | @@ -126,10 +126,12 @@ |
| 126 | 126 | if( (typeof jQuery("#profile_data_cell_phone").data("rawMaskFn") === 'undefined') ) { |
| 127 | 127 | jQuery("#profile_data_cell_phone").mask("(99) 9999?9-9999"); |
| 128 | 128 | jQuery("#profile_data_comercial_phone").mask("(99) 9999?9-9999"); |
| 129 | + jQuery("#profile_data_contact_phone").mask("(99) 9999?9-9999"); | |
| 129 | 130 | } |
| 130 | 131 | } else { |
| 131 | 132 | jQuery("#profile_data_cell_phone").unmask(); |
| 132 | 133 | jQuery("#profile_data_comercial_phone").unmask(); |
| 134 | + jQuery("#profile_data_contact_phone").unmask(); | |
| 133 | 135 | } |
| 134 | 136 | } |
| 135 | 137 | |
| ... | ... | @@ -147,75 +149,103 @@ |
| 147 | 149 | }); |
| 148 | 150 | } |
| 149 | 151 | |
| 150 | - function set_full_name_validation() { | |
| 151 | - // Sorry, I know its ugly. But I cant get ([^\w\*\s*])|(^|\s)([a-z]|[0-9]) | |
| 152 | - // to ignore Brazilian not so much special chars in names | |
| 153 | - function replace_some_special_chars(text) { | |
| 154 | - return text.replace(/([áàâãéèêíïóôõöú])/g, function(value){ | |
| 155 | - if( ["á","à","â","ã"].indexOf(value) != -1 ) | |
| 156 | - return "a"; | |
| 157 | - else if( ["é","è","ê"].indexOf(value) != -1 ) | |
| 158 | - return "e"; | |
| 159 | - else if( ["í","ï"].indexOf(value) != -1 ) | |
| 160 | - return "i"; | |
| 161 | - else if ( ["ó","ô","õ","ö"].indexOf(value) != -1 ) | |
| 162 | - return "o"; | |
| 163 | - else if( ["ú"].indexOf(value) != -1 ) | |
| 164 | - return "u"; | |
| 165 | - else | |
| 166 | - return value; | |
| 167 | - }); | |
| 168 | - } | |
| 152 | + // Sorry, I know its ugly. But I cant get ([^\w\*\s*])|(^|\s)([a-z]|[0-9]) | |
| 153 | + // to ignore Brazilian not so much special chars in names | |
| 154 | + function replace_some_special_chars(text) { | |
| 155 | + return text.replace(/([áàâãéèêíïóôõöú])/g, function(value){ | |
| 156 | + if( ["á","à","â","ã"].indexOf(value) != -1 ) | |
| 157 | + return "a"; | |
| 158 | + else if( ["é","è","ê"].indexOf(value) != -1 ) | |
| 159 | + return "e"; | |
| 160 | + else if( ["í","ï"].indexOf(value) != -1 ) | |
| 161 | + return "i"; | |
| 162 | + else if ( ["ó","ô","õ","ö"].indexOf(value) != -1 ) | |
| 163 | + return "o"; | |
| 164 | + else if( ["ú"].indexOf(value) != -1 ) | |
| 165 | + return "u"; | |
| 166 | + else | |
| 167 | + return value; | |
| 168 | + }); | |
| 169 | + } | |
| 169 | 170 | |
| 170 | - function is_invalid_formated(text) { | |
| 171 | - var full_validation = /([^\w\*\s*])|(^|\s)([a-z]|[0-9])/; // no special chars and do not initialize with no capital latter | |
| 172 | - var partial_validation = /[^\w\*\s*]/; // no special chars | |
| 173 | - text = replace_some_special_chars(text); | |
| 174 | - var slices = text.split(" "); | |
| 175 | - var invalid = false; | |
| 176 | - | |
| 177 | - for(var i = 0; i < slices.length; i++) { | |
| 178 | - if( slices[i].length > 3 ) { | |
| 179 | - invalid = full_validation.test(slices[i]); | |
| 180 | - } else { | |
| 181 | - invalid = partial_validation.test(slices[i]); | |
| 182 | - } | |
| 171 | + function is_invalid_formated(text) { | |
| 172 | + var full_validation = /([^\w\*\s*])|(^|\s)([a-z]|[0-9])/; // no special chars and do not initialize with no capital latter | |
| 173 | + var partial_validation = /[^\w\*\s*]/; // no special chars | |
| 174 | + text = replace_some_special_chars(text); | |
| 175 | + var slices = text.split(" "); | |
| 176 | + var invalid = false; | |
| 183 | 177 | |
| 184 | - if(invalid) break; | |
| 178 | + for(var i = 0; i < slices.length; i++) { | |
| 179 | + if( slices[i].length > 3 ) { | |
| 180 | + invalid = full_validation.test(slices[i]); | |
| 181 | + } else { | |
| 182 | + invalid = partial_validation.test(slices[i]); | |
| 185 | 183 | } |
| 186 | 184 | |
| 187 | - return invalid; | |
| 185 | + if(invalid) break; | |
| 188 | 186 | } |
| 189 | 187 | |
| 190 | - function show_full_name_error_message() { | |
| 191 | - var field = jQuery("#profile_data_name"); | |
| 188 | + return invalid; | |
| 189 | + } | |
| 192 | 190 | |
| 193 | - field.removeClass("validated").addClass("invalid"); | |
| 191 | + jQuery("#profile_data_name").blur(function(){ | |
| 192 | + jQuery(this).attr("class", ""); | |
| 194 | 193 | |
| 195 | - if(!jQuery(".full_name_error")[0]) { | |
| 196 | - var message = jQuery("#full_name_error").val(); | |
| 197 | - field.parent().append("<span class='full_name_error'>"+message+"</span>"); | |
| 198 | - } else { | |
| 199 | - jQuery(".full_name_error").show(); | |
| 200 | - } | |
| 194 | + if( this.value.length > 0 && is_invalid_formated(this.value) ) { | |
| 195 | + show_full_name_error_message(); | |
| 196 | + } else { | |
| 197 | + hide_full_name_error_message(); | |
| 201 | 198 | } |
| 199 | + }); | |
| 200 | + | |
| 202 | 201 | |
| 203 | - function hide_full_name_error_message() { | |
| 204 | - jQuery("#profile_data_name").removeClass("invalid").addClass("validated"); | |
| 205 | - jQuery(".full_name_error").hide(); | |
| 202 | + // Generic | |
| 203 | + function show_plugin_error_message(field_id, hidden_message_id ) { | |
| 204 | + var field = jQuery("#"+field_id); | |
| 205 | + | |
| 206 | + field.removeClass("validated").addClass("invalid"); | |
| 207 | + | |
| 208 | + if(!jQuery("." + hidden_message_id)[0]) { | |
| 209 | + var message = jQuery("#" + hidden_message_id).val(); | |
| 210 | + field.parent().append("<div class='" + hidden_message_id + " errorExplanation'>"+message+"</span>"); | |
| 211 | + } else { | |
| 212 | + jQuery("." + hidden_message_id).show(); | |
| 206 | 213 | } |
| 214 | + } | |
| 207 | 215 | |
| 208 | - jQuery("#profile_data_name").blur(function(){ | |
| 216 | + function hide_plugin_error_message(field_id, hidden_message_id) { | |
| 217 | + jQuery("#" + field_id).removeClass("invalid").addClass("validated"); | |
| 218 | + jQuery("." + hidden_message_id).hide(); | |
| 219 | + } | |
| 220 | + function addBlurFields(field_id, hidden_message_id, validation_function) { | |
| 221 | + jQuery("#" + field_id).blur(function(){ | |
| 209 | 222 | jQuery(this).attr("class", ""); |
| 210 | 223 | |
| 211 | - if( this.value.length > 0 && is_invalid_formated(this.value) ) { | |
| 212 | - show_full_name_error_message(); | |
| 224 | + if( this.value.length > 0 && validation_function(this.value) ) { | |
| 225 | + show_plugin_error_message(field_id, hidden_message_id); | |
| 213 | 226 | } else { |
| 214 | - hide_full_name_error_message(); | |
| 227 | + hide_plugin_error_message(field_id, hidden_message_id); | |
| 215 | 228 | } |
| 216 | 229 | }); |
| 217 | 230 | } |
| 218 | 231 | |
| 232 | + function invalid_email_validation(value) | |
| 233 | + { | |
| 234 | + var correct_format_regex = new RegExp(/^\w+@[a-zA-Z_]+?\.[a-zA-Z]{2,3}$/); | |
| 235 | + | |
| 236 | + return !correct_format_regex.test(value) | |
| 237 | + } | |
| 238 | + | |
| 239 | + function invalid_site_validation(value) | |
| 240 | + { | |
| 241 | + var correct_format_regex = new RegExp(/^http[s]{0,1}:\/\/[\w*\.]*/); | |
| 242 | + | |
| 243 | + return !correct_format_regex.test(value) | |
| 244 | + } | |
| 245 | + | |
| 246 | + //End generic | |
| 247 | + | |
| 248 | + | |
| 219 | 249 | jQuery(document).ready(function(){ |
| 220 | 250 | var selectFieldChoices = new SelectFieldChoices(); |
| 221 | 251 | set_initial_form_custom_data(selectFieldChoices); |
| ... | ... | @@ -246,6 +276,13 @@ |
| 246 | 276 | |
| 247 | 277 | fix_phone_mask_format("#profile_data_cell_phone"); |
| 248 | 278 | fix_phone_mask_format("#profile_data_comercial_phone"); |
| 279 | + fix_phone_mask_format("#profile_data_contact_phone"); | |
| 280 | + | |
| 281 | + addBlurFields("profile_data_name", "full_name_error", is_invalid_formated) | |
| 282 | + addBlurFields("profile_data_email", "email_error", invalid_email_validation) | |
| 283 | + addBlurFields("user_secondary_email", "email_error", invalid_email_validation) | |
| 284 | + addBlurFields("profile_data_personal_website", "site_error", invalid_site_validation) | |
| 285 | + addBlurFields("profile_data_organization_website", "site_error", invalid_site_validation) | |
| 249 | 286 | |
| 250 | 287 | window.setTimeout(function(){ |
| 251 | 288 | /* |
| ... | ... | @@ -253,7 +290,6 @@ |
| 253 | 290 | Then, to override an application.js validation, this code waits for 2 seconds. |
| 254 | 291 | Or else, application.js validation override this validation |
| 255 | 292 | */ |
| 256 | - set_full_name_validation(); | |
| 257 | 293 | }, 2000); |
| 258 | 294 | }); |
| 259 | 295 | })(); | ... | ... |
views/person_editor_extras.html.erb
| ... | ... | @@ -33,4 +33,6 @@ |
| 33 | 33 | </ul> |
| 34 | 34 | </div> |
| 35 | 35 | |
| 36 | -<%= hidden_field_tag("full_name_error", _("Should begin with a capital letter and no special characters")) %> | |
| 37 | 36 | \ No newline at end of file |
| 37 | +<%= hidden_field_tag("full_name_error", _("Should begin with a capital letter and no special characters")) %> | |
| 38 | +<%= hidden_field_tag("email_error", _("Email should have the following format: name@host.br")) %> | |
| 39 | +<%= hidden_field_tag("site_error", _("Site should have a valid format: http://name.hosts")) %> | |
| 38 | 40 | \ No newline at end of file | ... | ... |