Getting User Feedback, a Complete Survey Tutorial - Part 1

Today we will take you through developing a thorough, dynamic feedback form end to end. The first thing we need to do is determine what types of questions our client may want to ask users, we've decided on three: 1. Long answer (text-box), performance (poor - excellent) and guided (multiple choice). These will give out client the flexibility to try to get feedback on a large variety of topics and still have our database setup to handle it. The second item to consider is how these questions will be delivered. Should it be dynamic, where 10 questions are randomly pulled from a database of many more questions? This gives the client the ability to ask an unlimited number of questions, without worrying that they will overwhelm the user with survey length and get no feedback at all. Or should it be static, where the client has their list of questions and wants each user to answer each one. This way the client can be sure to get feedback on the questions that matter the most to them. Because we don't want to limit the client, the correct answer is of course, both. We will need a toggle indicating if the question is dynamic, or static and a survey setting where the client can choose how many dynamic questions to have (all static questions will be displayed every time). With that in mind, lets draw out our database. We will need a question (for the actually question), type (for one of our three types), is_static (our static toggle), options (a list for a 'guided' question), and we'll through a date_added field just for completeness.
CREATE TABLE  `feedback_questions` (
`question` VARCHAR( 255 ) NOT NULL ,
`type` VARCHAR( 15 ) NOT NULL ,
`options` VARCHAR( 255 ) NOT NULL ,
`is_static` TINYINT( 1 ) NOT NULL ,
`date_added` DATETIME NOT NULL
Now let's build the PHP script that the client will use to view and add questions. I've included a little javascript to allow the client to add options to a guided question, but everything else is a basic HTML form.
  • Question
  • Question Type
  • Always Ask
And here's the JS.
$('#q_type').change(function() {
        // hide all
        $.each($.viewMap, function() { this.hide(); });
        // show current
    var counter = 1;
    function addOption(){
          var newoption = document.createElement('div');
          newoption.innerHTML = "Option " + (counter + 1) + "
Remove"; document.getElementById("guided_q").appendChild(newoption); counter++; } function removeOption(n){ n.parentNode.parentNode.removeChild(n.parentNode); }
Now, we need to add the questions to the database when the client submits it. To do this, we will use the more secure and object oriented PHP functions MySQLi instead of MySQL.
        $options = "";
        // If it is a multiple choice question, change the option array into a string
        if($_POST["q_type"] == "guided")    
            foreach($_POST["options"] as $o)
                $options .= $o.", ";
            // Remove the trailing coma and space from the final string
            $options = substr($options, 0, -2);
        $sql = $db->prepare(" INSERT INTO feedback_questions  
                              (question, type, options, is_static, date_added)
                              VALUES (?, ?, ?, ?, ?)");
        $sql->bind_param("sssis", $_POST["question"], $_POST["q_type"], $options, $_POST["is_static"], date("Y-m-d H:M:S"));
Okay, we can finally completed the form and PHP and we can save questions! How great are we? Well, there is still work to do. Next, lets set up the page to view all our questions.
$stmt = $db->query('    SELECT question, type, options, is_static, date_added
            FROM feedback_questions 
            ORDER BY id DESC');
 *  Check if there are any questions if so, list them.
if($stmt->num_rows > 0)
     while($q = $stmt->fetch_assoc())
          // The question itself
          echo "".stripslashes($q['question'])."
"; // Show some info about the question echo ""; echo "Type: ".ucwords($q['type'])." | "; echo "Added: ".$q['date_added']. " | "; echo $q['is_static'] ? "Static" : "Rotating"; if ($q['type'] == "guided") echo "Options: ".stripslashes($q['options']); echo "

"; } // End while } // End if
That takes care of our admin side of the process. In part 2 we will start on the user side!
Small dog web development studio

View All Our Posts

Web application developers in western Washington, creating user centric web solutions for businesses of all shapes and sizes.

Our projects include ecommerce, event organization, user driven web applications and more.

Small Dog Studios, LLC. Small Dog Studios News