在PHP / javascript中显示数据库中的数据无法正常工作

I have a survey form displaying questions, answertype and number of options from my question table. Here's my code.

<?php

session_start();
ob_start();
$con = mysqli_connect("localhost","root","","imetrics");

$id = $_REQUEST['survey_id'];

$query =  "SELECT SF.survey_id, SF.surveytitle, SF.survey_description, SF.surveycategory, C.categoryname AS pcatname, SF.surveysubcategory, SC.categoryname AS scatname, SF.gender, SF.age_start, SF.age_end, SF.occupation, SF.date_created, O.name, SF.location, SF.occupation_status,  SF.status, SFQ.question_id, Q.questiontitle,L.location_name FROM surveyform AS SF
LEFT JOIN location AS L ON SF.location = L.location_id
LEFT JOIN category AS C ON SF.surveycategory = C.category_id
LEFT JOIN category AS SC ON SF.surveysubcategory = SC.category_id
INNER JOIN occupation AS O ON SF.occupation = O.occupation_id
INNER JOIN surveyform_questions AS SFQ ON SF.survey_id = SFQ.survey_id
INNER JOIN question AS Q ON SFQ.question_id = Q.question_id WHERE SFQ.survey_id  = $id";






$result = mysqli_query($con,$query);

if($result){
    while($row = mysqli_fetch_array($result)){
        $surveyid = $row['survey_id'];
        $title = $row['surveytitle'] ;
        $category = $row['pcatname'] ;
        $subcategory = $row['scatname'] ;
        $gender = $row['gender'];
        $agestart = $row['age_start'];
        $ageend = $row['age_end'];
        $occupation = $row['name'];
        $location = $row['location_name'];
        $occupationstatus = $row['occupation_status'];
        $datecreated = $row['date_created'];
        $description = $row['survey_description'];

    }
}


?>


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <title>Preview Survey</title>

    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href=" //maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdn.datatables.net/1.10.13/css/dataTables.bootstrap.min.css" rel="stylesheet">
    <style>
    h2.space {padding: 0%}
    h4.space {padding: 0%}

   </style>
   <?php error_reporting(0); ?>
  </head>
<body style="background-color:#f0f0f0;">
<br>
<div class="container">
    <div class="panel panel-default">   
      <div class="panel-body">

<div class=col-md-6>
<a href="previewsurveys.php"><button class="btn btn-default"><span class="glyphicon glyphicon-arrow-left"></span></button></a>
<a href="AdminDashboard.php"><button class="btn btn-default"><span class="glyphicon glyphicon-home"></span></button></a></div>
<div style="float:right;"><h4><font color="grey"> Survey Code: <?php echo $surveyid ?></font></h4></div>

<br>
<hr/>

          <div class="col-md-6">

          <h2 class="space"><?php echo $title ?></h2><br>
          <h4>Description: <?php echo $description ?></h4>
          <font color="grey"> Created: <?php echo $datecreated ?></font>
          </div>
          <div style="float:right;">

          <div class="col-md-10">
          <table>
          <tr>
          <td>Gender: </td>
          <td><input type=text class=form-control value=" <?php echo $gender ?>" disabled><td>
          </tr>
          <tr>
          <td>Age Range: </td>
          <td><input type=text class=form-control value=" <?php echo $agestart . " to " . $ageend . " y/o"; ?>" disabled></td>
          </tr>
          <tr>
          <td>Occupation: </td>
          <td><input type=text class=form-control value=" <?php echo $occupation ?>" disabled></td>
          </tr>
           <tr>
          <td>Location: </td>
          <td><input type=text class=form-control value=" <?php echo $location ?>" disabled></td>
          </tr>

          </table>
          </div>
      </div>
      </div>

      <hr>

      <div style="padding: 40px;">

      <form name="Answers" method="POST">
      <?php
$con = mysqli_connect("localhost","root","","imetrics");

$id = $_REQUEST['survey_id'];
$count=1;
$answer=0;
        $query =  "SELECT SF.survey_id, SF.surveytitle,  SF.surveycategory, C.categoryname, Q.answer_type, Q.Option_1, Q.Option_2, Q.Option_3, Q.Option_4, Q.Option_5, Q.Option_6, Q.Option_7, Q.Option_8, Q.Option_9, Q.Option_10 AS pcatname, SF.surveysubcategory, SC.categoryname AS scatname, SF.gender, SF.age_start, SF.age_end, SF.location, SF.occupation, O.name, SF.occupation_status, SF.status, SFQ.question_id, Q.questiontitle
         FROM surveyform AS SF 
         LEFT JOIN location AS L ON SF.location = L.location_id
        LEFT JOIN category AS C ON SF.surveycategory = C.category_id
        LEFT JOIN category AS SC ON SF.surveysubcategory = SC.category_id
        INNER JOIN occupation AS O ON SF.occupation = O.occupation_id
        INNER JOIN surveyform_questions AS SFQ ON SF.survey_id = SFQ.survey_id
        INNER JOIN question AS Q ON SFQ.question_id = Q.question_id
 WHERE SFQ.survey_id  = $id";

$result = mysqli_query($con,$query);

if($result){
    while($row = mysqli_fetch_array($result)){

        $questions = $row['questiontitle'];
        $qid = $row['question_id'];
        $anstype = $row['answer_type'];


        echo "<b>Question ". $count.".)</b> ". $questions. "</br>";

        $count++;
        $answer++;

        ?>

                <?php
                $option1 = $row['Option_1'];
                $option2 = $row['Option_2'];
                $option3 = $row['Option_3'];
                $option4 = $row['Option_4'];
                $option5 = $row['Option_5'];
                $option6 = $row['Option_6'];
                $option7 = $row['Option_7'];
                $option8 = $row['Option_8'];
                $option9 = $row['Option_9'];
                $option10 = $row['Option_10'];

                ?>


                <input type="text" class="form-control" value="<?php echo $qid ?>" name="question_<?php echo $answer; ?>">

                <?php if(!is_null($option1)){ ?>
                    <div id="option1" style="display:none;">

                    <?php if ($anstype == 'radiobutton'){ ?>
                        <input type="radio" name="answer_<?php echo $answer ?>" value="<?php echo $option1;?>" id="<?php echo $option1 ?>"><?php echo $option1; } ?>  

                        <?php if ($anstype == 'checkbox'){ ?>
                        <input type="checkbox" name="answer_<?php echo $answer ?>" value="<?php echo $option1;?>" id="<?php echo $option1 ?>"><?php echo $option1; } ?> 

                    </div>

                    <br />
                <?php } ?>


                <?php if(!is_null($option2)){ ?>
                    <div id="option2" style="display:none;">
                        <?php if ($anstype == 'radiobutton'){ ?>
                        <input type="radio" name="answer_<?php echo $answer ?>" value="<?php echo $option2;?>" id="<?php echo $option2 ?>"><?php echo $option2; } ?>  

                        <?php if ($anstype == 'checkbox'){ ?>
                        <input type="checkbox" name="answer_<?php echo $answer ?>" value="<?php echo $option2;?>" id="<?php echo $option2 ?>"><?php echo $option2; } ?> 
                    </div>
                    <br />
                <?php } ?>


                <?php if(!is_null($option3)){ ?>
                    <div id="option3" style="display:none;">
                        <?php if ($anstype == 'radiobutton'){ ?>
                        <input type="radio" name="answer_<?php echo $answer ?>" value="<?php echo $option3;?>" id="<?php echo $option3 ?>"><?php echo $option3; } ?>  

                        <?php if ($anstype == 'checkbox'){ ?>
                        <input type="checkbox" name="answer_<?php echo $answer ?>" value="<?php echo $option3;?>" id="<?php echo $option3 ?>"><?php echo $option3; } ?> 
                    </div>
                    <br />
                <?php } ?>

                <?php if(!is_null($option4)){ ?>
                    <div id="option4" style="display:none;">
                        <?php if ($anstype == 'radiobutton'){ ?>
                        <input type="radio" name="answer_<?php echo $answer ?>" value="<?php echo $option4;?>" id="<?php echo $option4 ?>"><?php echo $option4; } ?>  

                        <?php if ($anstype == 'checkbox'){ ?>
                        <input type="checkbox" name="answer_<?php echo $answer ?>" value="<?php echo $option4;?>" id="<?php echo $option4 ?>"><?php echo $option4; } ?> 
                    </div>
                    <br />
                <?php } ?>

                <?php if(!is_null($option5)){ ?>
                    <div id="option5" style="display:none;">
                        <?php if ($anstype == 'radiobutton'){ ?>
                        <input type="radio" name="answer_<?php echo $answer ?>" value="<?php echo $option5;?>" id="<?php echo $option5 ?>"><?php echo $option1; } ?>  

                        <?php if ($anstype == 'checkbox'){ ?>
                        <input type="checkbox" name="answer_<?php echo $answer ?>" value="<?php echo $option5;?>" id="<?php echo $option5 ?>"><?php echo $option5; } ?> 
                    </div>
                    <br />
                <?php } ?>

                <?php if(!is_null($option6)){ ?>
                    <div id="option6" style="display:none;">
                       <?php if ($anstype == 'radiobutton'){ ?>
                        <input type="radio" name="answer_<?php echo $answer ?>" value="<?php echo $option6;?>" id="<?php echo $option6 ?>"><?php echo $option6; } ?>  

                        <?php if ($anstype == 'checkbox'){ ?>
                        <input type="checkbox" name="answer_<?php echo $answer ?>" value="<?php echo $option6;?>" id="<?php echo $option6 ?>"><?php echo $option6; } ?> 
                    </div>
                    <br />
                <?php } ?>

                <?php if(!is_null($option7)){ ?>
                    <div id="option7" style="display:none;">
                        <?php if ($anstype == 'radiobutton'){ ?>
                        <input type="radio" name="answer_<?php echo $answer ?>" value="<?php echo $option7;?>" id="<?php echo $option7 ?>"><?php echo $option7; } ?>  

                        <?php if ($anstype == 'checkbox'){ ?>
                        <input type="checkbox" name="answer_<?php echo $answer ?>" value="<?php echo $option7;?>" id="<?php echo $option7 ?>"><?php echo $option7; } ?> 
                    </div>
                    <br />
                <?php } ?>

                <?php if(!is_null($option8)){ ?>
                    <div id="option8" style="display:none;">
                        <?php if ($anstype == 'radiobutton'){ ?>
                        <input type="radio" name="answer_<?php echo $answer ?>" value="<?php echo $option8;?>" id="<?php echo $option8 ?>"><?php echo $option8; } ?>  

                        <?php if ($anstype == 'checkbox'){ ?>
                        <input type="checkbox" name="answer_<?php echo $answer ?>" value="<?php echo $option8;?>" id="<?php echo $option8 ?>"><?php echo $option8; } ?> 
                    </div>
                    <br />
                <?php } ?>

                <?php if(!is_null($option9)){ ?>
                    <div id="option9" style="display:none;">
                        <?php if ($anstype == 'radiobutton'){ ?>
                        <input type="radio" name="answer_<?php echo $answer ?>" value="<?php echo $option9;?>" id="<?php echo $option9 ?>"><?php echo $option9; } ?>  

                        <?php if ($anstype == 'checkbox'){ ?>
                        <input type="checkbox" name="answer_<?php echo $answer ?>" value="<?php echo $option9;?>" id="<?php echo $option9 ?>"><?php echo $option9; } ?> 
                    </div>
                    <br />
                <?php } ?>

                <?php if(!is_null($option10)){ ?>
                    <div id="option10" style="display:none;">
                        <?php if ($anstype == 'radiobutton'){ ?>
                        <input type="radio" name="answer_<?php echo $answer ?>" value="<?php echo $option10;?>" id="<?php echo $option10 ?>"><?php echo $option10; } ?>  

                        <?php if ($anstype == 'checkbox'){ ?>
                        <input type="checkbox" name="answer_<?php echo $answer ?>" value="<?php echo $option10;?>" id="<?php echo $option10 ?>"><?php echo $option10; } ?> 
                    </div>

                    </div>
                    <br />
                <?php } }?>



                <hr>
               <input type="submit" name="submitsurvey"  value="Submit" class="btn btn-default">
               <INPUT TYPE = "hidden" Name = "id"  VALUE = <?PHP echo $id; ?>>


            </form>





</div>
</div>
</body>
    </html>


<?php

 if (isset($_POST['submitsurvey'])) {


        for($i=1; $i<=$count; $i++){
        $selected_radio = $_POST["answer_".$i];
        $idNumber = $_POST['id'];
        $questionid = $_POST["question_".$i];
        $username = $_SESSION['username'];



        $database = "imetrics";

        $con = new mysqli("localhost","root","", $database );

        if($questionid <> "")
        {
            $qq = "INSERT INTO surveyperusername VALUES ('".$username."','".$idNumber."','".$questionid."','".$selected_radio."')";
            $rr = mysqli_query($con,$qq);
        }
        if ($con) {
            if($selected_radio == $option1) {
                $query = "UPDATE results SET Answer_1 = Answer_1 + 1 WHERE survey_id = $idNumber AND question_id = $questionid";
                $result = mysqli_query($con,$query);      
            }
            else if($selected_radio == $option2){
                $query = "UPDATE results SET Answer_2 = Answer_2 + 1 WHERE survey_id = $idNumber AND question_id = $questionid";
                $result = mysqli_query($con,$query);
            }
            else if($selected_radio == $option3){
                $query = "UPDATE results SET Answer_3 = Answer_3 + 1 WHERE survey_id = $idNumber AND question_id = $questionid";
                $result = mysqli_query($con,$query);
            }
            else if($selected_radio == $option4){
                $query = "UPDATE results SET Answer_4 = Answer_4 + 1 WHERE survey_id = $idNumber AND question_id = $questionid";
                $result = mysqli_query($con,$query);
            }
            else if($selected_radio == $option5){
                $query = "UPDATE results SET Answer_5 = Answer_5 + 1 WHERE survey_id = $idNumber AND question_id = $questionid";
                $result = mysqli_query($con,$query);
            }
            else if($selected_radio == $option6){
                $query = "UPDATE results SET Answer_6 = Answer_6 + 1 WHERE survey_id = $idNumber AND question_id = $questionid";
                $result = mysqli_query($con,$query);
            }
            else if($selected_radio == $option7){
                $query = "UPDATE results SET Answer_7 = Answer_7 + 1 WHERE survey_id = $idNumber AND question_id = $questionid";
                $result = mysqli_query($con,$query);
            }
            else if($selected_radio == $option8){
                $query = "UPDATE results SET Answer_8 = Answer_8 + 1 WHERE survey_id = $idNumber AND question_id = $questionid";
                $result = mysqli_query($con,$query);
            }
            else if($selected_radio == $option9){
                $query = "UPDATE results SET Answer_9 = Answer_9 + 1 WHERE survey_id = $idNumber AND question_id = $questionid";
                $result = mysqli_query($con,$query);
            }
            else if($selected_radio == $option10){
                $query = "UPDATE results SET Answer_10 = Answer_10 + 1 WHERE survey_id = $idNumber AND question_id = $questionid";
                $result = mysqli_query($con,$query);
            }


            else
            {

                   echo '<script language="javascript">';
        echo 'alert("Survey Submitted!")';
        echo '</script>';
            }

        }
    }

}

 }

?>

This is the table where I'm getting the data to display

enter image description here

In this pictures it's only displaying 3 options for each question even though some questions have more than 3 options. How do I get it to display all the options that have value depending on each question and not just 3? Like some questions have more than 3 options that have value but it's only displaying 3enter image description here

enter image description here

When I remove style="display:none" enter image description here

when I remove the jquery code enter image description here

what the top of my page looks like enter image description here

1) Id attribute should be unique for each element.

2) You have much code redundant .reduce the code redundant using for loop .

3) Remove your unwanted display:none style property and jquery . because you can able to handle the empty option in server side code .

PHP : Simplified version of your code

$result = mysqli_query($con,$query);

if($result)
{

    while($row = mysqli_fetch_array($result))
    {

        $questions = $row['questiontitle'];
        $qid = $row['question_id'];
        $anstype = $row['answer_type'];
        $count++;
        $answer++;

        echo "<b>Question ". $count.".)</b> ". $questions. "</br>";


        $option1 = $row['Option_1'];
        $option2 = $row['Option_2'];
        $option3 = $row['Option_3'];
        $option4 = $row['Option_4'];
        $option5 = $row['Option_5'];
        $option6 = $row['Option_6'];
        $option7 = $row['Option_7'];
        $option8 = $row['Option_8'];
        $option9 = $row['Option_9'];
        $option10 = $row['Option_10'];

         ?>


         <input style="display:none" type="text" class="form-control" value="<?php echo $qid ?>" name="question_<?php echo $answer; ?>">

        <?php   
        for($j=1;j<=10;$j++)
        {

             if(isset(${'Option_'.$j}) && !empty(${'Option_'.$j}) )
             { 
             ?>

                   <div>
                        <input type="<?php if($anstype == 'radiobutton'){  echo 'radio'; }else{ echo 'checkbox';  }?>" name="answer_<?php echo $answer ?>" value="<?php echo ${'Option_'.$j};?>" id="<?php echo ${'Option_'.$j}; ?>"><?php echo ${'Option_'.$j};  ?>
                    </div>
             <?php  
             }
             ?>  


            <br/>

        <?php 
        } 
        ?>

                <?php  

    }

}  

?>