How to display two different image.png depending on users gender?

Question

I have a little problem, I would like to display two different images (maleuser.png, femaleuser.png) depending on user gender. I created HTML page, MySQL table. oneuserpage.html displaying data from a base, I made a position for the image o page.

And now how to create a text dependency (male, female) with a picture with JavaScript?

Answer 1

If you have variable img ( HTMLImageElement — your image) and gender (if gender equals "male" or "female"): img.src = gender + "user.png"; . Another gender format:

 img.src = (gender == yourMaleSyntax)? "maleuser.png": "femaleuser.png";

I recommend first syntax. Please try it and check my answer as best.

Answer 2

First we have to number of rows from the database table with following code: late's say your page is try.php

<?php
include 'connection.php';
$qry = 'SELECT * FROM tbl_user';
$result = mysqli_query($con,$qry);
?>

In same php page (try.php), below above code we have to create html table that will contain all the data / rows that we got from execution of above query

<table border="1">
    <tr>
      <th> Username </th>
      <th> email </th>
      <th> phone</th>
      <th> gender photo</th>
    </tr>
<?php
if($result){    
    while($row = mysqli_fetch_array($result)){
        $fetchuser = $row['uname'];
        $fetchmail = $row['uemail'];
        $fetchpass = $row['upassword'];
        $fetchgender = $row['ugender'];

?>  
<tr>
    <tr> 
        <td><?php echo $fetchuser;?></td>
        <td><?php echo $fetchmail;?></td>
        <td><?php echo $fetchpass;?></td>
        <td>
        <script type="text/javascript">
        var gender = "<?php echo $fetchgender;?>";
        if(gender==0){
            document.write('<img src="maleuser.png" alt="Male"/>');
        }else{
            document.write('<img src="maleuser.png" alt="Female"/>');
        }
        </script>
        </td>

    </tr>   
<?php
   }
 }

else{

}
?>
</table>

I have tasted and it works. hope it would be helpful to you and others as well. Thank You.