Context Navigation

source: Dev/trunk/classes/SurveyCreationTool.php @ 17

Last change on this file since 17 was 17, checked in by fpvanagthoven, 14 years ago
Multiple choice option functional.
File size: 8.3 KB

Rev	Line
[10]	1	<?php
	2
	3	/**
	4	* Description of SurveyTool
	5	*
	6	* SurveyTool is where the survey can be created.
	7	*
	8	*/
	9	class SurveyCreationTool {
	10
	11	public function __construct() {
[11]	12	SurveyCreationTool::javascript();
	13	?>
[17]	14
[11]	15	<div id="surveyCreation"><form action="submitsurvey.php" method="post">
	16	<?php
	17	SurveyCreationTool::titleBox();
	18	SurveyCreationTool::descriptionBox();
	19	SurveyCreationTool::questionCreationForm();
[17]	20	SurveyCreationTool::addQuestionButton();
[11]	21	SurveyCreationTool::submitButton();
	22	?></form></div>
	23	<?php
[10]	24	}
	25
[11]	26	private static function javascript() {
	27	?>
	28	<script type="text/javascript">
[17]	29	var questionCount = 1;
	30
	31	function getNewQuestion()
	32	{
	33	var questionDiv = document.createElement("div");
	34	var htmlStr =
	35	"<div id='question" + questionCount + "' class='question'>" +
	36	"<table class='questionTable'>" +
	37	"<th>Question " + questionCount + "</th>" +
	38	"<tr><td><label for='questionTitle'>Title</label></td>" +
	39	"<td><input type='text' class='questionTitle' name='questionTitle" + questionCount + "' size='30' value='Untitled Question' /></td></tr>" +
	40	"<tr><td><label for='questionDescription'>Description</label></td>" +
	41	"<td><input type='text' class='questionDescription' name='questionDescription" + questionCount + "' size='60' value='Write a question description here.' /></td>" +
	42	"<tr><td><label for='questionType'>Answer type</label></td>" +
	43	"<td><select id='" + questionCount + "' name='questionType" + questionCount + "' onchange='handleType(this)'><br />"+
	44	"<option value='text' selected='selected'>Text</option>" +
	45	"<option value='multipleChoice'>Multiple choice</option>" +
	46	"<option value='checkboxes'>Checkboxes</option>" +
	47	"<option value='scale'>Scale</option>" +
	48	"<option value='grid'>Grid</option>" +
	49	"</select></td></tr>" +
	50	"</table>" +
	51	"<div id='answersDiv" + questionCount + "'></div>" +
	52	"</div>";
	53
	54	questionDiv.innerHTML = htmlStr;
	55
	56	return questionDiv;
	57	}
	58
[11]	59	function handleFocus(input)
	60	{
	61	if (input.clicked == null)
	62	{
	63	input.value = "";
	64	input.style.color = "black";
	65	input.clicked = true;
	66	}
	67	}
[17]	68
[11]	69	function handleBlur(input)
[17]	70	{
	71	var surveyTitle = document.getElementById('surveyTitle');
	72	var surveyDescription = document.getElementById('surveyDescription');
	73
[11]	74	if (input.value == "")
	75	{
	76	input.style.color = "gray";
	77	input.clicked = null;
[17]	78
	79	if (input == surveyTitle)
	80	{
	81	input.value = "Untitled Survey";
	82	}
	83	else if (input == surveyDescription)
	84	{
	85	input.value = "Write a helpful description for this survey here.";
	86	}
	87	}
	88	}
	89
	90	function handleType(select)
	91	{
	92	var type = select.valueOf().value;
	93	var answersDiv = document.getElementById("answersDiv" + select.id);
	94	answersDiv.answerCount = 1;
	95	answersDiv.clicked = null;
	96
	97	switch (type) {
	98	case 'multipleChoice':
	99	answersDiv.innerHTML = "";
	100	addOption(select.id);
	101
	102	break;
	103	case 'text':
	104	answersDiv.innerHTML = "";
	105
	106	break;
	107	case 'checkboxes':
	108	answersDiv.innerHTML = "";
	109	break;
	110	case 'scale':
	111	answersDiv.innerHTML = "";
	112	break;
	113	case 'grid':
	114	answersDiv.innerHTML = "";
	115	break;
	116	default:
	117	break;
[11]	118	}
[17]	119
[11]	120	}
[17]	121
	122
	123	function addOption(questionNumber)
	124	{
	125	var answersDiv = document.getElementById("answersDiv" + questionNumber);
	126	var answerCount = answersDiv.answerCount;
	127	var answerDiv = document.createElement("div");
	128	answerDiv.className = "answerDiv";
	129
	130	var htmlStr = "<input type='text' name='q" +
	131	questionNumber + "ans" + answerCount + "' value='Option " + answerCount + "' />";
	132
	133	if (answersDiv.clicked == null)
	134	{
	135	htmlStr += "<input type='button' id='addOpt'"
	136	+ " class='surveyButton' onclick='addOption(" + questionNumber + ")' value='Add Option' />";
	137	answersDiv.clicked = true;
	138	}
	139
	140	answerDiv.innerHTML = htmlStr;
	141
	142	answersDiv.appendChild(answerDiv);
	143	answersDiv.answerCount++;
	144	}
	145
	146
	147	function addQuestion()
	148	{
	149	var questionsDiv = document.getElementById('questionsDiv');
	150	var newQuestion = getNewQuestion();
	151
	152	questionsDiv.appendChild(newQuestion);
	153	questionCount++;
	154	}
	155
[11]	156	</script>
	157	<?php
	158	}
	159
[10]	160	private static function titleBox() {
[11]	161	?>
[17]	162	<input type="text" id="surveyTitle" name="surveyTitle" value="Untitled Survey" size="30" onblur="handleBlur(this)" onfocus="handleFocus(this)" />
[11]	163	<?php
[10]	164	}
[11]	165
	166	private static function descriptionBox() {
	167	?>
[17]	168	<textarea id="surveyDescription" rows="3" cols="80" name="surveyDescription" onblur="handleBlur(this)" onfocus="handleFocus(this)">Write a helpful description for this survey here.</textarea>
[11]	169	<?php
[10]	170	}
[11]	171
	172	private static function questionCreationForm() {
[17]	173	?>
	174	<div id='questionsDiv'>
	175	</div>
	176	<script type="text/javascript"> addQuestion(); </script>
	177	<?php
[11]	178	}
	179
	180	private static function addQuestionButton() {
[17]	181	?>
	182	<input id="addQuestionButton" type="button" onclick="addQuestion()" value="Add New Question" class="surveyButton" />
	183	<?php
[10]	184	}
	185
[11]	186	private static function submitbutton() {
	187	?>
	188	<input type="submit" name="submitSurvey"
[17]	189	value="Submit Survey!" class="surveyButton" id="submitSurvey"/>
[11]	190	<?php
	191	}
	192
[10]	193	}
	194	?>

Note: See TracBrowser for help on using the repository browser.

Download in other formats: