-3

I am trying to insert a button when I am populate a table dynamically. I have the data that loads correctly the table and I am able to insert the button. When I click the button it displays the alert box just to check it's working. However when I try to get the data of the first cell of that row it gets the error that $ is not defined.

This is my code:

<?php
            $file = 'data.json';
            $data = file_get_contents($file);
            $json = json_decode($data);
            echo"<pre>";
            print_r($json);
            echo"</pre>";
        ?>
        <form method="POST" action="">
            <center><button class="btn btn-primary" name="display">Populate</button></center>
        </form>
    </div>
    <table class="table table-bordered table-example">
<thead class="alert-info">
    <tr>
        <th>Firstname</th>
        <th>Lastname</th>
        <th>Age</th>
    </tr>
</thead>
<tbody>
    <?php
        $url = 'data.json';
        $data = file_get_contents($url);
        $json = json_decode($data);
        
        foreach($json as $member){
    ?>
    <tr>
        <td><?php echo $member->firstname?></td>
        <td><?php echo $member->lastname?></td>
        <td><?php echo $member->gender?></td>
        <td><button class="btn btn-info button-details" onclick="myFunction()">>detalhes</button> 
 </td>
    </tr>
    <?php
        }
    ?>
</tbody>
</table>
    <div class="col-md-6">
        <?php include 'populate_json.php';?>
    </div>
</div>

<script type="text/javascript">

    
    function myFunction() {
alert("botao funciona");
        
        $(".table-example").find("tr td:first"); *this is not working
        
}

1 Answers1

0

include this in your html head:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
Nils Schwebel
  • 641
  • 4
  • 14