MYMEMORY WARNING: YOU USED ALL AVAILABLE FREE TRANSLATIONS FOR TODAY. NEXT AVAILABLE IN 23 HOURS 55 MINUTES 57 SECONDS VISIT HTTPS://MYMEMORY.TRANSLATED.NET/DOC/USAGELIMITS.PHP TO TRANSLATE MORE

MYMEMORY WARNING: YOU USED ALL AVAILABLE FREE TRANSLATIONS FOR TODAY. NEXT AVAILABLE IN 23 HOURS 55 MINUTES 55 SECONDS VISIT HTTPS://MYMEMORY.TRANSLATED.NET/DOC/USAGELIMITS.PHP TO TRANSLATE MORE

MYMEMORY WARNING: YOU USED ALL AVAILABLE FREE TRANSLATIONS FOR TODAY. NEXT AVAILABLE IN 23 HOURS 55 MINUTES 53 SECONDS VISIT HTTPS://MYMEMORY.TRANSLATED.NET/DOC/USAGELIMITS.PHP TO TRANSLATE MORE

MYMEMORY WARNING: YOU USED ALL AVAILABLE FREE TRANSLATIONS FOR TODAY. NEXT AVAILABLE IN 23 HOURS 55 MINUTES 52 SECONDS VISIT HTTPS://MYMEMORY.TRANSLATED.NET/DOC/USAGELIMITS.PHP TO TRANSLATE MORE

MYMEMORY WARNING: YOU USED ALL AVAILABLE FREE TRANSLATIONS FOR TODAY. NEXT AVAILABLE IN 23 HOURS 55 MINUTES 50 SECONDS VISIT HTTPS://MYMEMORY.TRANSLATED.NET/DOC/USAGELIMITS.PHP TO TRANSLATE MORE

<div class="container-xxl flex-grow-1 container-p-y">
             
<h2 align="center"><?php echo $appname?></h2><br />
   <div class="form-group">
   <form name="add_name" id="add_name">
                    
   <div class="table-responsive">
      <table class="table table-bordered" id="dynamic_field">
         <?php while ($checks = mysqli_fetch_array($checksqry)) {
            echo  <tr> ;
            echo  <td style="width: 20%"> .$checks[ check_name ].  <br><br> 
            <input type="radio" class="btn-check" name="btn[  . $checks[ id ] .  ]" id="btnpass[  . $checks[ id ] .  ]" value="Pass">
            <label class="btn rounded-pill btn-outline-success" for="btnpass[  . $checks[ id ] .  ]">Pass</label>&Tab;&Tab;
                    
           <input type="radio" class="btn-check" name="btn[  . $checks[ id ] .  ]" id="btnwarning[  . $checks[ id ] .  ]" value="Warning">
           <label class="btn rounded-pill btn-outline-warning" for="btnwarning[  . $checks[ id ] .  ]">Warning</label>&Tab;&Tab;
                    
           <input type="radio" class="btn-check" name="btn[  . $checks[ id ] .  ]" id="btnfail[  . $checks[ id ] .  ]" value="Fail">
           <label class="btn rounded-pill btn-outline-danger" for="btnfail[  . $checks[ id ] .  ]">Fail</label>&Tab;&Tab;
                    
           <button onclick="myFunction()" type="button" name="comment[  . $checks[ id ] .  ]" id="comment[  . $checks[ id ] .  ]" class="btn btn-info" style="float: right"><img src="assets/comment.png" width="20px"></button> 
<br><br>
           <div id="commentlinediv[  . $checks[ id ] .  ]">
           <input type="text" class="text-line" placeholder="Type Comment Here" id="commentline[  . $checks[ id ] .  ]"/>
</div>
</td> ;
echo  <tr> ;}?>
                        
</table>
<input type="button" name="submit" id="submit" class="btn btn-info" value="Submit" />
</div>
</form>
</div>
</div>

input[type="text"] {
   border:none; /* Get rid of the browser s styling */
   border-bottom:1px solid black; /* Add your own border */
}

.text-line {
   background-color: transparent;
   color: black;
   outline: none;
   outline-style: none;
   border-top: none;
   border-left: none;
   border-right: none;
   border-bottom: solid #eeeeee 1px;
   padding: 3px 10px;
   width: 300px;
}
                
#commentlinediv[<?php echo $checks[ id ]?>]{
   display: none;
}

function myFunction() {
document.getElementById("commentlinediv[<?php $checks[ id ]?>]").style.display = "inline";
}