Geczy · August 25, 2015 00:57
diff --git a/gistfile1.txt b/gistfile1.txt
 var questionID;

 function rebind() {
 	$('.addQuestion').on('click', function (e) {
 		$('#saveNewQuestion').data('findid', $(this));
 		$('#firstQuestionModal').modal('show');
 	})
 }


 $(function () {
 	$(document).on('click', '.delete', deleteItem);
 	$("#newSurvey").on('click', function (e) {
 		var text = $("#newText").val();
 		// alert(text);
 		$("#tree")
 			.append('<ul>' + text +
 				'<button type="button" class="btn btn-primary addQuestion" data-target="#firstQuestionModal" id="">Add Base Question</button><button class="delete">Delete</button></ul>');
 		$("#newText").val('');
 		rebind();
 	});

 	$('#saveNewQuestion').on('click', function (e) {
 		var buttonClicked = $(this).data('findid');
 		var text = $("#firstQuestionText").val();

 		$(buttonClicked).closest('ul').append('<ul><button type="button" class="addQuestion" data-target="#firstQuestionModal">Add Child</button><button class="delete">Delete</button></ul>');
 		rebind();

 		$("#firstQuestionText").val('');

 	});

 	$("#submit-ajax").on('click', ajax);
 	$(document).on('click', '.addChoice', addChoice);
 	$(document).on('click', '.addChoiceChild', addChoiceChild);
 });



 function deleteItem() {
 	$(this).parent().remove();
 }

 function addChoice() {
 	$(".addChoice").hide();
 	$("#choices").append("<input type=\"text\" class=\"choice\"> <button class=\"addChoice\">...Add Choice</button> <br>");
 }

 function addChoiceChild() {
 	$(".addChoiceChild").hide();

 	$("#choicesChild").append("<input type=\"text\" class=\"choice\"> <button class=\"addChoice\">...Add Choice</button> <br>");
 }

 function ajax() {
 	var text = $("#newText").val();
 	// if(myData != )
 	if ($.trim(text) != '') {
 		$.post('databasing.php', {
 			name: text
 		}, function (data) {
 			// alert(data);
 			myData = data;
 			$('div#display').text(myData);
 			showInBox();
 		});
 	}

 }


 function showInBox() {
 	var myDataInt = parseInt(myData);
 	myData = myDataInt + 1;
 	alert(myData);
 }

 <!DOCTYPE html>
 <html>
 <head>
    <title>CreateSurvey</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="scripts.js"></script>
    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

    <!-- Optional theme -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">

    <!-- Latest compiled and minified JavaScript -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
    <!-- Button trigger modal -->

 </head>
 <body>
    <div class="container">

        <h1>Tree Constructor</h1>

        <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#parentModal">
            Create Survey
        </button> <br><br><br>

        <!-- Modal For Parent-->

        <div class="modal fade" id="parentModal" tabindex="-1" role="dialog" aria-labelledby="parentModalLabel">
          <div class="modal-dialog" role="document">
            <div class="modal-content">
              <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="parentModalLabel">Create New Survey</h4>
            </div>
            <div class="modal-body">
                What do you want to call this survey?
                <input type='text' id="newText"/>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary" id='newSurvey' data-dismiss="modal">Save changes</button>
            </div>
        </div>
    </div>
 </div>

 <!-- Modal For firstQuestion-->

 <br><br><br>


 <div class="modal fade" id="firstQuestionModal" tabindex="-1" role="dialog" aria-labelledby="firstQuestionModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="firstQuestionModalLabel">Create New Survey</h4>
    </div>
    <div class="modal-body">
        What is the prompt for the first question? <br>
        <input type='text' id="firstQuestionText"/> <br>
        What format do you want this question to be asked in? <br>
        <select class="form-control">
            <option>Big Question (Yes or No)</option>
            <option>Agree or Disagree (1 thru 10)</option>
            <option>Multiple Choice</option>
            <option>Checkboxes</option>
        </select><br>
        Enter choices text(min 2, max 10 choices)... <br>
        <div id="choices">
            <input type="text" class="choice"> <br>
            <input type="text" class="choice"> <button class="addChoice">...Add Choice</button> <br>

        </div>
    </div>
    <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary" id='saveNewQuestion' data-dismiss="modal">Save changes</button>
    </div>
 </div>
 </div>
 </div>

 <div id = 'tree'>

 </div>
 <!-- <div id="display">

    <input type="submit" id = "submit-ajax" value="submit">
 </div>  -->
 </body>
 </html>
	var questionID;

	function rebind() {
	$('.addQuestion').on('click', function (e) {
	$('#saveNewQuestion').data('findid', $(this));
	$('#firstQuestionModal').modal('show');
	})
	}


	$(function () {
	$(document).on('click', '.delete', deleteItem);
	$("#newSurvey").on('click', function (e) {
	var text = $("#newText").val();
	// alert(text);
	$("#tree")
	.append('<ul>' + text +
	'<button type="button" class="btn btn-primary addQuestion" data-target="#firstQuestionModal" id="">Add Base Question</button><button class="delete">Delete</button></ul>');
	$("#newText").val('');
	rebind();
	});

	$('#saveNewQuestion').on('click', function (e) {
	var buttonClicked = $(this).data('findid');
	var text = $("#firstQuestionText").val();

	$(buttonClicked).closest('ul').append('<ul><button type="button" class="addQuestion" data-target="#firstQuestionModal">Add Child</button><button class="delete">Delete</button></ul>');
	rebind();

	$("#firstQuestionText").val('');

	});

	$("#submit-ajax").on('click', ajax);
	$(document).on('click', '.addChoice', addChoice);
	$(document).on('click', '.addChoiceChild', addChoiceChild);
	});



	function deleteItem() {
	$(this).parent().remove();
	}

	function addChoice() {
	$(".addChoice").hide();
	$("#choices").append("<input type=\"text\" class=\"choice\"> <button class=\"addChoice\">...Add Choice</button> <br>");
	}

	function addChoiceChild() {
	$(".addChoiceChild").hide();

	$("#choicesChild").append("<input type=\"text\" class=\"choice\"> <button class=\"addChoice\">...Add Choice</button> <br>");
	}

	function ajax() {
	var text = $("#newText").val();
	// if(myData != )
	if ($.trim(text) != '') {
	$.post('databasing.php', {
	name: text
	}, function (data) {
	// alert(data);
	myData = data;
	$('div#display').text(myData);
	showInBox();
	});
	}

	}


	function showInBox() {
	var myDataInt = parseInt(myData);
	myData = myDataInt + 1;
	alert(myData);
	}

	<!DOCTYPE html>
	<html>
	<head>
	<title>CreateSurvey</title>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
	<script src="scripts.js"></script>
	<!-- Latest compiled and minified CSS -->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

	<!-- Optional theme -->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">

	<!-- Latest compiled and minified JavaScript -->
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
	<!-- Button trigger modal -->

	</head>
	<body>
	<div class="container">

	<h1>Tree Constructor</h1>

	<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#parentModal">
	Create Survey
	</button> <br><br><br>

	<!-- Modal For Parent-->

	<div class="modal fade" id="parentModal" tabindex="-1" role="dialog" aria-labelledby="parentModalLabel">
	<div class="modal-dialog" role="document">
	<div class="modal-content">
	<div class="modal-header">
	<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
	<h4 class="modal-title" id="parentModalLabel">Create New Survey</h4>
	</div>
	<div class="modal-body">
	What do you want to call this survey?
	<input type='text' id="newText"/>
	</div>
	<div class="modal-footer">
	<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
	<button type="button" class="btn btn-primary" id='newSurvey' data-dismiss="modal">Save changes</button>
	</div>
	</div>
	</div>
	</div>

	<!-- Modal For firstQuestion-->

	<br><br><br>


	<div class="modal fade" id="firstQuestionModal" tabindex="-1" role="dialog" aria-labelledby="firstQuestionModalLabel">
	<div class="modal-dialog" role="document">
	<div class="modal-content">
	<div class="modal-header">
	<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
	<h4 class="modal-title" id="firstQuestionModalLabel">Create New Survey</h4>
	</div>
	<div class="modal-body">
	What is the prompt for the first question? <br>
	<input type='text' id="firstQuestionText"/> <br>
	What format do you want this question to be asked in? <br>
	<select class="form-control">
	<option>Big Question (Yes or No)</option>
	<option>Agree or Disagree (1 thru 10)</option>
	<option>Multiple Choice</option>
	<option>Checkboxes</option>
	</select><br>
	Enter choices text(min 2, max 10 choices)... <br>
	<div id="choices">
	<input type="text" class="choice"> <br>
	<input type="text" class="choice"> <button class="addChoice">...Add Choice</button> <br>

	</div>
	</div>
	<div class="modal-footer">
	<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
	<button type="button" class="btn btn-primary" id='saveNewQuestion' data-dismiss="modal">Save changes</button>
	</div>
	</div>
	</div>
	</div>

	<div id = 'tree'>

	</div>
	<!-- <div id="display">

	<input type="submit" id = "submit-ajax" value="submit">
	</div> -->
	</body>
	</html>