如何避免在MYSQL / PHP / Javascript中显示具有NULL值的列？

Question

I have a table structure that has 10 null-able columns. Therefore, now some of fields in the table are NULL.

Here's my what I've done so far:

<?php
session_start();
ob_start();
$con = mysqli_connect("localhost","root","","imetrics");    
$query =  "SELECT * FROM question";
$result = mysqli_query($con,$query);
if($result){
    while($row = mysqli_fetch_array($result)){
         echo $row['questiontitle'];
?>
<form action="">
<?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'];    
?>
  <div id="option1" style="display:none;"><input type="radio" name="answer" value="<?php echo $option1 ?>" id="<?php echo $option1 ?>"><?php echo $option1 ?></div><br>
  <div id="option2" style="display:none;"><input type="radio" name="answer" value="<?php echo $option2 ?>" id="<?php echo $option2 ?>"><?php echo $option2 ?></div><br>
  <div id="option3" style="display:none;"><input type="radio" name="answer" value="<?php echo $option3 ?>" id="<?php echo $option3 ?>"><?php echo $option3 ?></div><br>
  <div id="option4" style="display:none;"><input type="radio" name="answer" value="<?php echo $option4 ?>" id="<?php echo $option4 ?>"><?php echo $option4 ?></div><br>
  <div id="option5" style="display:none;"><input type="radio" name="answer" value="<?php echo $option5 ?>" id="<?php echo $option5 ?>"><?php echo $option5 ?></div><br>
  <div id="option6" style="display:none;"><input type="radio" name="answer" value="<?php echo $option6 ?>" id="<?php echo $option6 ?>"><?php echo $option6 ?></div><br>
  <div id="option7" style="display:none;"><input type="radio" name="answer" value="<?php echo $option7 ?>" id="<?php echo $option7 ?>"><?php echo $option7 ?></div><br>
  <div id="option8" style="display:none;"><input type="radio" name="answer" value="<?php echo $option8 ?>" id="<?php echo $option8 ?>"><?php echo $option8 ?></div><br>
  <div id="option9" style="display:none;"><input type="radio" name="answer" value="<?php echo $option9 ?>" id="<?php echo $option9 ?>"><?php echo $option9 ?></div><br>
  <div id="option10" style="display:none;"><input type="radio" name="answer" value="<?php echo $option10 ?>" id="<?php echo $option10 ?>"><?php echo $option10 ?></div><br>   
</form>
<script src="//code.jquery.com/jquery-1.12.4.js"></script>
<script type="text/javascript">
  jQuery(function($) { 
  var id1 = <?php echo json_encode($option1); ?>;
  var id2 = <?php echo json_encode($option2); ?>;
  var id3 = <?php echo json_encode($option3); ?>;
  var id4 = <?php echo json_encode($option4); ?>;
  var id5 = <?php echo json_encode($option5); ?>;
  var id6 = <?php echo json_encode($option6); ?>;
  var id7 = <?php echo json_encode($option7); ?>;
  var id8 = <?php echo json_encode($option8); ?>;
  var id9 = <?php echo json_encode($option9); ?>;
  var id10 = <?php echo json_encode($option10); ?>;
  if (id1 != null) { $("div#option1").show(); }
  if (id2 != null) { $("div#option2").show(); }
  if (id3 != null) { $("div#option3").show(); }
  if (id4 != null) { $("div#option4").show(); }
  if (id5 != null) { $("div#option5").show(); }
  if (id6 != null) { $("div#option6").show(); }
  if (id7 != null) { $("div#option7").show(); }
  if (id8 != null) { $("div#option8").show(); }
  if (id9 != null) { $("div#option9").show(); }
  if (id10 != null) { $("div#option10").show(); }
 })(jQuery);
</script>
<?php
}}
?>

How should I hide the radio buttons with the corresponding null value in database? Its now displaying all of them regardless of their value.

Answer 1

Replace the lines in charge of displaying radio buttons with the following:

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