简体   繁体   中英

How to avoid displaying the columns that have NULL value in MYSQL/PHP/Javascript?

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.

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 } ?>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM