How to use PHP loop variable in javascript?

Question

I have run an SQL statement to get all the records I need to show in a HTML table.

I have then run a while loop to display the records from the database. (The code for this is below.)

 <table class="projects-table">
                <tr>
                    <th>Complete?</th>
                    <th>Paid?</th>
                    <th>Project Name</th>
                    <th>£ / hr</th>
                    <th>End Date</th>
                    <th>Hours Logged</th>
                    <th><i class="fa fa-trash"></i></th>
                </tr>
                <?php 
                        $select_id_jobs = mysqli_query($mysqli, "SELECT id FROM users WHERE username='$login_user'");
                    while($row = mysqli_fetch_array($select_id_jobs)) {
                        $id_jobs = $row['id'];
                    }
                    $select_jobs_with_usrid = mysqli_query($mysqli, "SELECT * FROM jobs WHERE username_id = '$id_jobs';");
                    while($row = mysqli_fetch_array($select_jobs_with_usrid)) {
                ?>

                <tr id="<?php echo $rowId; ?>">
                    <td>
                        <!-- Complete Checkbox -->
                        <input type="checkbox" id="<?php echo $completeCheck;?>" onclick="compTask();">
                    </td>
                    <td>
                        <!-- Paid checkbox -->
                        <input type="checkbox" onclick="paidTask()">
                    </td>
                    <td>
                        <?php echo $row['project_title']; ?>
                    </td>
                    <td>
                        <?php echo $row['cost_hour']; ?>
                    </td>
                    <td>
                        <?php echo $row['completion_date']; ?>
                    </td>
                    <td>
                        <?php echo $row['time_spent']; ?>
                    </td>
                    <td>
                        <div class="delete-btn"><a onclick="deleteTask()">DELETE</a></div>
                    </td>
                </tr>
                <?php } ?>
            </table>

As you can see from the checkbox for completing a task. What I want to do is use javascript so that when the checkbox is checked the text from the other records turns green. I have included the javascript I am trying to use below. I don't know why but I can't access the inputs ID in order to change the css.

<script>
    function compTask() {
        if (document.getElementById("<?php echo 'complete-' . $row['id'] ?>").checked == true) {
            document.getElementById("<?php echo 'tr' . $row['id']; ?>").style.color = "green";
            alert("hello");
        } else {
            document.getElementById("<?php echo 'tr' . $row['id']; ?>").style.color = "black";
        }
    }

Khaled Alam · Accepted Answer · 2018-02-18 20:20:35Z

1

Okay easy way to do that is to print id as parameter in js function

something like that:

<input type="checkbox" id="<?php echo $completeCheck;?>" 
          onclick="compTask( '<?php echo $row['id'];?>' );">

and in js function deal with id from parameter:

function compTask(id) {
    if (document.getElementById('complete-' + id).checked == true) {
        document.getElementById('tr' + id).style.color = "green";
        alert("hello");
    }
}

answered Feb 18, 2018 at 20:20

Khaled Alam

9057 silver badges16 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Fiodorov Andrei · Accepted Answer · 2018-02-18 20:20:30Z

0

Hy,

You need to add id in onclick="deleteTask('<?php echo $row['id']; ?>')">

Now in you function have id:

function deleteTask(id) { console.log(id) }

answered Feb 18, 2018 at 20:20

Fiodorov Andrei

2,0481 gold badge19 silver badges31 bronze badges

Collectives™ on Stack Overflow

How to use PHP loop variable in javascript?

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related