Changeset 53

Timestamp:

07/26/11 15:02:58 (14 years ago)

Author:

fpvanagthoven

Message:

Inputchecking for integers.

Location:

Dev/trunk

Files:

• classes/SurveyCreationTool.php (modified) (20 diffs)
• css/style.css (modified) (3 diffs)

Dev/trunk/classes/SurveyCreationTool.php

@@ -37 +37 @@
             /* autosave every 3 minutes */
             setTimeout("save('<?php echo $id; ?>')", 180000);
-                                                                                                                                                                            
+                                                                                                                                                                                                            
             var questionCount = 1;          
-                                                                                                                                                                                                                                                                                                                    
+                                                                                                                                                                                                                                                                                                                                                    
             function getNewQuestion(title, description)
             {
                 if (title == null)
                     var title = 'Untitled Question';
-                                                                                                                
+                                                                                                                                                
                 if (description != null)
                     var description = description;
                 else
                     var description = 'Write a question description here.';
-                                                                                                                                    
+                                                                                                                                                                    
                 var questionDiv = document.createElement("div");
                 var htmlStr = 
@@ -70 +70 @@
                     "<div id='answersDiv" + questionCount + "' class='answersDiv'></div>" +
                     "</div>";
-                                                                                                                                                                                                                                                                                                                
+                                                                                                                                                                                                                                                                                                                                                
                 questionDiv.innerHTML = htmlStr;
-                                                                                                                                                                                                                                                                                                                
+                                                                                                                                                                                                                                                                                                                                                
                 return questionDiv;
             }
-                                                                                                                                                                                                                                                                                                                    
+                                                                                                                                                                                                                                                                                                                                                    
             function handleFocus(input)
             {
@@ -90 +90 @@
                 }
             }
-                                                                                                                                                                                                                                                                                                                                                    
+                                                                                                                                                                                                                                                                                                                                                                                    
             function handleBlur(input)
             {        
                 var surveyTitle = document.getElementById('surveyTitle');
                 var surveyDescription = document.getElementById('surveyDescription');
-                                                                                                                                                                                                                                                                                                                                    
+                                                                                                                                                                                                                                                                                                                                                                    
                 if (input.value == "")
                 {
                     input.style.color = "gray";
                     input.clicked = null;
-                                                                                                                                                                                                                                                                                                                                                            
+                                                                                                                                                                                                                                                                                                                                                                                            
                     if (input == surveyTitle)
                     {
@@ -111 +111 @@
                 }                           
             }
-                                                                                                                                                                                                                                                                                                    
+                                                                                                                                                                                                                                                                                                                                    
             function handleType(select, answers)
             {
@@ -117 +117 @@
                 var type = select.valueOf().value;
                 var answersDiv = document.getElementById("answersDiv" + numQ );
-                
+                                                
                 removeQuestionID(numQ);
-                
+                                                
                 answersDiv.answerCount = 1;
                 answersDiv.clicked = null;
-                                                                                                                                                                                                                                                        
+                                                                                                                                                                                                                                                                                        
                 switch (type) {
                     case 'mc':
@@ -135 +135 @@
                         else
                             addOption(numQ);
-                                                                                                                                                                                                                                                                                        
+                                                                                                                                                                                                                                                                                                                        
                         break;
                     case 'text':
@@ -142 +142 @@
                     case 'int':    
                         answersDiv.innerHTML = "";
-                                                                                                                
+                                                                                                                                                
                         //min max
                         if (answers != null)
@@ -174 +174 @@
 
             }
-            
+                                            
             function handleAnswerChange(questionNumber)
             {
                 removeQuestionID(questionNumber);
             }
-            
+                                            
             function removeQuestionID(questionNumber)
             {
@@ -191 +191 @@
 
             }
-                     
-                                                                                                                                                                                                                                                                            
+                                                     
+                                                                                                                                                                                                                                                                                                            
             function addOption(questionNumber, optionStr)
             {        
@@ -198 +198 @@
                 var answerCount = answersDiv.answerCount;
                 var answerDiv = document.createElement("div");
-                                                
+                                                                                
                 if (optionStr == null)
                     var optionStr = "Option " + answerCount;
-                                                
-                                               
+                                                                                
+                                                                               
                 answerDiv.className = "answerDiv";
-                                                                                                                                                                                                                                                                                
+                                                                                                                                                                                                                                                                                                                
                 var htmlStr = "<input type='text' name='q" + 
                     questionNumber + "ans" + answerCount + "' onchange='handleAnswerChange(" + questionNumber + ")' value='" + optionStr + "' />";
-                                                                                                                                                                                                                                                        
+                                                                                                                                                                                                                                                                                        
                 if (answersDiv.clicked == null)
                 {
@@ -213 +213 @@
                         + " class='surveyButton' onclick='addOption(" + questionNumber + ")' value='Add Option' />" +
                         "<input type='button' class='surveyButton' onclick='removeOption(" + questionNumber + ")' value='x' />";
-                                                                                                                                                                                                                            
+                                                                                                                                                                                                                                                            
                     answersDiv.clicked = true;
                 }
-                                                                                                                                                                                                                                                                                       
+                                                                                                                                                                                                                                                                                                                       
                 answerDiv.innerHTML = htmlStr;
-                                                                                                                                                                                                                        
+                                                                                                                                                                                                                                                        
                 answerDiv.prev = answersDiv.lastAnswer; //singly linked list
                 answersDiv.lastAnswer = answerDiv;
-                                                                                                                                                                                                                                                                                       
+                                                                                                                                                                                                                                                                                                                       
                 answersDiv.appendChild(answerDiv);
                 answersDiv.answerCount++;
-                
+                                                
                 handleAnswerChange(questionNumber);
             }
-                                                                                                                                                                                                                    
+                                                                                                                                                                                                                                                    
             function removeOption(questionNumber)
             {
                 var answersDiv = document.getElementById("answersDiv" + questionNumber);
-                                                                                                                                                                                                                       
+                                                                                                                                                                                                                                                       
                 if (answersDiv.lastAnswer.prev != null)
                 {
@@ -238 +238 @@
                     answersDiv.answerCount--;
                 }
-                
+                                                
                 handleAnswerChange(questionNumber);
             }
-                                                                                                                                                                                                                                            
+                                                                                                                                                                                                                                                                            
             function minMax(questionNumber, min, max)
             {
@@ -248 +248 @@
                 if (max == null)
                     var max = '';
-                                                                                                        
+                                                                                                                                        
                 var answersDiv = document.getElementById("answersDiv" + questionNumber);
-                                                                                                                                                                                                                                               
+                                                                                                                                                                                                                                                                               
                 var answerDiv = document.createElement("div");
-                                                                                                                                                                                                                
+                                                                                                                                                                                                                                                
                 answerDiv.className = "answerDiv";
-                answerDiv.innerHTML = "<label for='min'>Min</label><input type='text' value='" + min + "' name='q" + questionNumber + "ans1' />" +
-                    "<label for='max'>Max</label><input type='text' value='" + max + "' name='q" + questionNumber + "ans2' />";
-                                                                                                                                                                                                                                           
+                answerDiv.innerHTML = "<label for='min'>Min</label><input type='text' class='intBox' onchange='checkInt(this)' value='" + min + "' name='q" + questionNumber + "ans1' />" +
+                    "<label for='max'>Max</label><input type='text' class='intBox' onchange='checkInt(this)' value='" + max + "' name='q" + questionNumber + "ans2' />";
+                                                                                                                                                                                                                                                                           
                 answersDiv.appendChild(answerDiv);
             }  
-                                                                                                                                                                                                                                            
+                                                                                                                                                                                                                                                                            
             function minMaxIncr(questionNumber, left, right, incr)
             {
@@ -268 +268 @@
                 if (incr == null)
                     var incr = '';
-                                                        
+                                                                                        
                 var answersDiv = document.getElementById("answersDiv" + questionNumber);
-                                                                                                                                                                                                                                               
+                                                                                                                                                                                                                                                                               
                 var answerDiv = document.createElement("div");
                 answerDiv.className = "answerDiv";
                 answerDiv.innerHTML = "<label>Left label</label><input type='text' value='" + left + "' onchange='handleAnswerChange(" + questionNumber + ")' name='q" + questionNumber + "ans1' />" +
                     "<label>Right label</label><input type='text' value='" + right + "' onchange='handleAnswerChange(" + questionNumber + ")' name='q" + questionNumber + "ans2' />" +
-                    "<label>Scale count</label><input type='text' value='" + incr + "' onchange='handleAnswerChange(" + questionNumber + ")' name='q" + questionNumber + "ans3' />" +
+                    "<label>Scale count</label><input type='text' class='intBox' value='" + incr + "' onblur='checkInt(this)' onchange='handleAnswerChange(" + questionNumber + ")' name='q" + questionNumber + "ans3' />" +
                     "<div id='inputCheckFeedback'" + questionNumber + "";
-                                                                                                                                                                                                                                           
+                                                                                                                                                                                                                                                                           
                 answersDiv.appendChild(answerDiv);
             }         
-                                                                                                                                                                                                                                                                                                 
-                                                                                                                                                                                                                                                                                                         
+                                                                                                                                                                                                                                                                                                                                 
+                                                                                                                                                                                                                                                                                                                                         
             function addQuestion(title, description)
             {
                 var questionsDiv = document.getElementById('questionsDiv');
                 var newQuestion = getNewQuestion(title, description);
-                                                                                                                                                                                                                                        
+                                                                                                                                                                                                                                                                        
 
                 newQuestion.prev = document.lastQuestion;
@@ -294 +294 @@
                 questionCount++;
             }
-                                                                                                                                                                                                                                    
+                                                                                                                                                                                                                                                                    
             function removeLastQuestion()
             {
                 var questionsDiv = document.getElementById('questionsDiv');
-                                                                                                                                                                                                                                        
+                                                                                                                                                                                                                                                                        
                 if (document.lastQuestion.prev != null)
                 {
@@ -310 +310 @@
                 }               
             }
-                                                                                                                                                                                                             
+                                                                                                                                                                                                                                             
             function save(surveyID)
             {
+                if (checksPassed())
+                {
+                    var form = document.getElementById('survey');
+                    var questionsDiv = document.getElementById('questionsDiv');
+                    form.action = "surveycreation.php";
+                                                                                                                                                                                                                
+                    /* extra time stamp */
+                    var date = new Date();
+                    var minutes = date.getUTCMinutes();
+                    if (minutes < 10)
+                        minutes = "0" + minutes;
+                    var timeStamp = date.getHours() + ":" + minutes;
+                    var timeStampInput = document.createElement("input");
+                    timeStampInput.name = "timeStamp";
+                    timeStampInput.value = timeStamp;
+                    timeStampInput.type = "hidden";
+                                                                                                                                                                    
+                    var surveyIDInput = document.createElement("input");
+                    surveyIDInput.name = "surveyID";
+                    surveyIDInput.value = surveyID;
+                    surveyIDInput.type = "hidden";
+                                                                                                                                                                                             
+                    questionsDiv.appendChild(timeStampInput);
+                    questionsDiv.appendChild(surveyIDInput);
+                    form.submit();
+                }
+            }
+                                            
+            function selectAll(input)
+            {
+                input.select();
+            }
+                                            
+            /* --- input checking --- */
+            function checksPassed()
+            {
                 var form = document.getElementById('survey');
-                var questionsDiv = document.getElementById('questionsDiv');
-                form.action = "surveycreation.php";
-                                                                                                                                                                                
-                /* extra time stamp */
-                var date = new Date();
-                var minutes = date.getUTCMinutes();
-                if (minutes < 10)
-                    minutes = "0" + minutes;
-                var timeStamp = date.getHours() + ":" + minutes;
-                var timeStampInput = document.createElement("input");
-                timeStampInput.name = "timeStamp";
-                timeStampInput.value = timeStamp;
-                timeStampInput.type = "hidden";
-                                                                                                                                    
-                var surveyIDInput = document.createElement("input");
-                surveyIDInput.name = "surveyID";
-                surveyIDInput.value = surveyID;
-                surveyIDInput.type = "hidden";
-                                                                                                                                                             
-                questionsDiv.appendChild(timeStampInput);
-                questionsDiv.appendChild(surveyIDInput);
-                form.submit();
-            }
-            
-            function selectAll(input)
-            {
-                input.select();
-            }
-                                                                                                                                                                                                                                                                                                                                                                                                           
+                        
+                for (var i = 0; i < form.length; i++)
+                {
+                    if (form.elements[i].checkPassed == 'no')
+                        return false;
+                }
+                return true;
+            }
+                    
+            function checkInt(input)
+            {
+                input.style.borderWidth = '1px' ;
+                var value = input.value;
+                if (isNaN(value))
+                {
+                    input.style.borderColor = 'red';
+                    input.checkPassed = 'no';
+                }
+                else
+                {
+                    input.style.border = '1px solid #abadb3';
+                    input.checkPassed = null;
+                }
+            }
+                                            
+                                                                                                                                                                                                                                                                                                                                                                                                                                           
         </script>
         <?php
@@ -389 +422 @@
         <?php
     }
-    
+
     private function surveyLink() {
-        if (isset($this->survey))
-        {
-                $surveyID = $this->survey->id;
-                
-                $link = $_SERVER['HTTP_HOST'] . dirname($_SERVER['PHP_SELF']) . 
+        if (isset($this->survey)) {
+            $surveyID = $this->survey->id;
+
+            $link = $_SERVER['HTTP_HOST'] . dirname($_SERVER['PHP_SELF']) .
                     '/survey.php?id=' . $surveyID;
-        ?>
-        <input type="text" value="<?php echo $link; ?>" id="surveyLink" onclick="selectAll(this)">
-        <?php
+            ?>
+            <input type="text" value="<?php echo $link; ?>" id="surveyLink" onclick="selectAll(this)">
+            <?php
         }
     }
@@ -419 +451 @@
                 }
                 ?>
-                                                                                                    
+                                                                                                                                                                    
                     addQuestion('<?php echo $question->title; ?>', '<?php echo $question->description; ?>');
-                                                                                                                                                                                                    
+                                                                                                                                                                                                                                                                    
                     var select = document.getElementById('<?php echo $numQ; ?>');
                     var type = '<?php echo $question->type; ?>';
@@ -433 +465 @@
                         }
                     }      
-                                    
-                                    
+                                                                                                    
+                                                                                                    
                     /* questionID stuff */
                     var questionIDInput = document.createElement("input");
@@ -441 +473 @@
                     questionIDInput.value = "<?php echo $question->id; ?>";
                     questionIDInput.type = "hidden";
-                                                                                                                                                                                     
+                                                                                                                                                                                                                                                     
                     document.getElementById("questionsDiv").appendChild(questionIDInput);
 

Dev/trunk/css/style.css

@@ -17 +17 @@
     color: #333;
     text-shadow: #fff 0px 0px 10px;
-    margin: 0 0 0.5em 0;
+    margin: 0 0 0.1em 0;
 }
 
@@ -272 +272 @@
 
 .centerBoxed {
-    margin: 0 auto;
+    margin: 1em auto;
     width: 30em;
     text-align: center;
     padding: 0 1em;
+    font-size: small;
     /*    border: 1px solid gray;*/
 }
@@ -292 +293 @@
 .intBox {
     width: 5em;
+    margin: 0 .3em;
+    border: 1px solid #abadb3;
 }