form-script.js

   1 var character_counter = document.getElementById('CharacterCount');
   2 var error_msg = document.getElementById('errorMsg');
   3 var error_msg_text = document.createTextNode("");
   4 error_msg.appendChild(error_msg_text);
   5 var textarea = document.getElementById('Comment');
   6 var submit = document.getElementById('submit');
   7 submit.setAttribute('disabled','');
   8
   9 function checkIfSubmitToBeDisabled(){
  10         //check all file fontainers
  11         for(var i = 1 ; i <= 4; i++){
  12                 if(document.getElementById("f" + i).files.length == 0){
  13                         var length = textarea.value.length;
  14                         if(length == 0) {
  15                                 submit.setAttribute('disabled','');
  16                                 error_msg_text.nodeValue = "value", "Input a comment and/or file";
  17                         }
  18                 }
  19                 else{
  20                         var length = textarea.value.length;
  21                         if(length > 500){
  22                                 characterCountColoring();
  23                                 return;
  24                         }
  25                         else{
  26                                 submit.removeAttribute('disabled');
  27                                 eerror_msg_text.nodeValue = "Click to submit";
  28                                 return;
  29                         }
  30                 }
  31         }
  32 }
  33
  34 function characterCountColoring(){
  35         var length = textarea.value.trim().length;
  36         var red = 0; var blue = 100; var green = 100;
  37         if(length == 0){
  38                 submit.setAttribute('disabled','');
  39                 error_msg_text.nodeValue = "Input a comment and/or file";
  40         }
  41         else if(length > 500){
  42                 red = 255; blue = 0; green = 0;
  43                 submit.setAttribute('disabled','');
  44                 error_msg_text.nodeValue = "Character count exceeded(>500)";
  45         }
  46         else{
  47                 red = Math.ceil(length/500 * 180);
  48                 submit.removeAttribute('disabled');
  49                 error_msg.innerHTML = "Click to submit";
  50         }
  51         character_counter.innerHTML = '<span style=\'color:rgb(' + red + ',' + green + ',' + blue + ')\'>' + length + '</span>'
  52 }
  53
  54 function setFileListener(file){
  55         file_node = document.getElementById(file);
  56         (function(_file_node){
  57                 _file_node.addEventListener("change", checkIfSubmitToBeDisabled);
  58         })(file_node);
  59 }
  60
  61 for(var i = 1 ; i <= 4; i++) setFileListener("f" + i);
  62
  63 if (textarea.addEventListener) {
  64         textarea.addEventListener('input', function() {
  65                 characterCountColoring();
  66   }, false);
  67 }
  68 else if (textarea.attachEvent) {
  69         textarea.attachEvent('onpropertychange', function() {
  70                 characterCountColoring();
  71   });
  72 }