Calculator widget template (radio button): Difference between revisions

Jump to navigation Jump to search
(Created page with "<includeonly> <!--REPLACE NAME_OF_THE_SCORE AND VALUE AND ANSWER WITH THE PROPER INFORMATION--> <script type="text/javascript"> function calcScore(){ var score = 0; if(docum...")
 
No edit summary
Line 1: Line 1:
<includeonly>
<includeonly>


<!--REPLACE NAME_OF_THE_SCORE AND VALUE AND ANSWER WITH THE PROPER INFORMATION-->
<!--REPLACE NAME_OF_THE_SCORE AND ID AND VALUE AND ANSWER WITH THE PROPER INFORMATION-->


<script type="text/javascript">
<script type="text/javascript">
function calcScore(){
function calcScore(){
var score = 0;
var ID_SCORE= 0;
if(document.forms["NAME_OF_THE_SCORE"]["input1"].checked == 1){score += VALUE_1;}
if (document.getElementById('ID_1').checked == 1) {ID_SCORE += VALUE_1;}
if(document.forms["NAME_OF_THE_SCORE"]["input2"].checked == 1){score += VALUE_2;}
if (document.getElementById('ID_2').checked == 1) {ID_SCORE += VALUE_2;}
if(document.forms["NAME_OF_THE_SCORE"]["input3"].checked == 1){score += VALUE_3;}
if (document.getElementById('ID_3').checked == 1) {ID_SCORE += VALUE_3;}
 
var score = ID_SCORE + 0;
if(document.forms["NAME_OF_THE_SCORE"]["input4"].checked == 1){score += VALUE_4;}
if(document.forms["NAME_OF_THE_SCORE"]["input4"].checked == 1){score += VALUE_4;}
if(document.forms["NAME_OF_THE_SCORE"]["input5"].checked == 1){score += VALUE_5;}
if(document.forms["NAME_OF_THE_SCORE"]["input5"].checked == 1){score += VALUE_5;}
Line 16: Line 18:


document.forms["NAME_OF_THE_SCORE"]["result"].value = score;
document.forms["NAME_OF_THE_SCORE"]["result"].value = score;
if(score == 0){document.forms["NAME_OF_THE_SCORE"]["longanswer"].value = "ANSWER_1";}
if(score >= 2){document.forms["NAME_OF_THE_SCORE"]["longanswer"].value = "ANSWER_1";}
if(score == 1){document.forms["NAME_OF_THE_SCORE"]["longanswer"].value = "ANSWER_2";}
if(score <= 1){document.forms["NAME_OF_THE_SCORE"]["longanswer"].value = "ANSWER_2";}
if(score == 2){document.forms["NAME_OF_THE_SCORE"]["longanswer"].value = "ANSWER_3";}
if(score == 3){document.forms["NAME_OF_THE_SCORE"]["longanswer"].value = "ANSWER_4";}
if(score == 4){document.forms["NAME_OF_THE_SCORE"]["longanswer"].value = "ANSWER_5";}
if(score >= 5 && score <= 10){document.forms["NAME_OF_THE_SCORE"]["longanswer"].value = "ANSWER_6";}
}
}
</script>
</script>
Line 47: Line 45:
<td style="text-align: left; color: #ffffff; background: #4479BA; padding: 2px 10px; border-radius: 5px 5px 5px 5px; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);">VARIABLE_1</td>
<td style="text-align: left; color: #ffffff; background: #4479BA; padding: 2px 10px; border-radius: 5px 5px 5px 5px; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);">VARIABLE_1</td>
<td style="color: #ffffff; background: #4479ba; padding: 2px 10px; border-radius: 5px; text-shadow: rgba(0, 0, 0, 0.5) 0px -1px 0px; box-shadow: rgba(0, 0, 0, 0.5) 0px 1px 1px; text-align: center;"><strong>VALUE_1</strong></td>
<td style="color: #ffffff; background: #4479ba; padding: 2px 10px; border-radius: 5px; text-shadow: rgba(0, 0, 0, 0.5) 0px -1px 0px; box-shadow: rgba(0, 0, 0, 0.5) 0px 1px 1px; text-align: center;"><strong>VALUE_1</strong></td>
<td style="text-align: center; color: #ffffff; background: #4479BA; padding: 2px 10px; border-radius: 5px 5px 5px 5px; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);"><input style="top: 4px; width: 24px; height: 24px;" name="input1" type="checkbox" onchange="calcScore();" /></td>
<td style="text-align: center; color: #ffffff; background: #4479BA; padding: 2px 10px; border-radius: 5px 5px 5px 5px; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);"><input style="top: 4px; width: 24px; height: 24px;" name="input1" type="radio" id="ID_1" onclick="calcScore();" /></td>
</tr>
</tr>


Line 55: Line 53:
<td style="text-align: left; color: #ffffff; background: #4479BA; padding: 2px 10px; border-radius: 5px 5px 5px 5px; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);">VARIABLE_2</td>
<td style="text-align: left; color: #ffffff; background: #4479BA; padding: 2px 10px; border-radius: 5px 5px 5px 5px; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);">VARIABLE_2</td>
<td style="color: #ffffff; background: #4479ba; padding: 2px 10px; border-radius: 5px; text-shadow: rgba(0, 0, 0, 0.5) 0px -1px 0px; box-shadow: rgba(0, 0, 0, 0.5) 0px 1px 1px; text-align: center;"><strong>VALUE_2</strong></td>
<td style="color: #ffffff; background: #4479ba; padding: 2px 10px; border-radius: 5px; text-shadow: rgba(0, 0, 0, 0.5) 0px -1px 0px; box-shadow: rgba(0, 0, 0, 0.5) 0px 1px 1px; text-align: center;"><strong>VALUE_2</strong></td>
<td style="text-align: center; color: #ffffff; background: #4479BA; padding: 2px 10px; border-radius: 5px 5px 5px 5px; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);"><input style="top: 4px; width: 24px; height: 24px;" name="input2" type="checkbox" onchange="calcScore();" /></td>
<td style="text-align: center; color: #ffffff; background: #4479BA; padding: 2px 10px; border-radius: 5px 5px 5px 5px; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);"><input style="top: 4px; width: 24px; height: 24px;" name="input1" type="radio" id="ID_2" onclick="calcScore();" /></td>
</tr>
</tr>


Line 63: Line 61:
<td style="text-align: left; color: #ffffff; background: #4479BA; padding: 2px 10px; border-radius: 5px 5px 5px 5px; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);">VARIABLE_3</td>
<td style="text-align: left; color: #ffffff; background: #4479BA; padding: 2px 10px; border-radius: 5px 5px 5px 5px; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);">VARIABLE_3</td>
<td style="color: #ffffff; background: #4479ba; padding: 2px 10px; border-radius: 5px; text-shadow: rgba(0, 0, 0, 0.5) 0px -1px 0px; box-shadow: rgba(0, 0, 0, 0.5) 0px 1px 1px; text-align: center;"><strong>VALUE_3</strong></td>
<td style="color: #ffffff; background: #4479ba; padding: 2px 10px; border-radius: 5px; text-shadow: rgba(0, 0, 0, 0.5) 0px -1px 0px; box-shadow: rgba(0, 0, 0, 0.5) 0px 1px 1px; text-align: center;"><strong>VALUE_3</strong></td>
<td style="text-align: center; color: #ffffff; background: #4479BA; padding: 2px 10px; border-radius: 5px 5px 5px 5px; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);"><input style="top: 4px; width: 24px; height: 24px;" name="input3" type="checkbox" onchange="calcScore();" /></td>
<td style="text-align: center; color: #ffffff; background: #4479BA; padding: 2px 10px; border-radius: 5px 5px 5px 5px; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);"><input style="top: 4px; width: 24px; height: 24px;" name="input1" type="radio" id="ID_3" onclick="calcScore();" /></td>
</tr>
</tr>


Line 109: Line 107:


<tr>
<tr>
<td style="text-align: left; color: #4479BA; background: #ffffff; padding: 2px 10px; border-radius: 5px 5px 5px 5px; text-shadow: 0 0 0 rgba(0, 0, 0, 0.5); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5); font-size: 10pt;" colspan="3"> NAME_OF_THE_SCORE: <input name="result" type="text" maxlength="2" size="4" style="border: white; font-size: 10pt; font-weight: normal; font-family: Arial;"/></td>
<td style="text-align: left; color: #4479BA; background: #ffffff; padding: 2px 10px; border-radius: 5px 5px 5px 5px; text-shadow: 0 0 0 rgba(0, 0, 0, 0.5); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5); font-size: 10pt;" colspan="3">NAME_OF_THE_SCORE:<input name="result" type="text" maxlength="2" size="4" style="border: white; font-size: 10pt; font-weight: normal; font-family: Arial;"/></td>
</tr>
</tr>



Revision as of 05:04, 9 February 2019