How typing JavaScript function oncklick button it called

hi all ,
this is my code in php and html

 <?php 
    while ($row = mysqli_fetch_array($query))
  { echo '<tr>
                  <td width="25" bgcolor="#bb99ff"> # ('.$row['id'].')</td>
                  <td width="25" bgcolor="#80e5ff" colspan = "5"> '.$row['D1'].'  :  '.$row['R1'].'  :  '.$row['D2'].'  :  '.$row['D3'].'  :  '.$row['D4'].'  :  '.$row['D5'].'  :  '.$row['D8'].'</td>
                  <tr>
<td colspan = "5"><textarea rows="10" cols="75" name="message"></textarea></td>
<td colspan = "5"><textarea readonly rows="10" cols="75">'.$row['s1'].'.</textarea></td></tr>
                  <tr>
<td width="25" bgcolor="#80e5ff">'.$row['T1'].'</td> </tr><tr><td>
<input type="submit"  value="replay" onclick=calling javasecript function with (.$row['T1'].,'.$row['s1'].'.';/> </td></tr>';}
?>

quistion is how can i calling JavaScript function that accept this row as argument. (.$row[‘T1’].,‘.$row[‘s1’].’. when submit cklicked ?

Hi @skenazi, doing this would be possible, but it’s usually a bad idea to mix up PHP, HTML and JS like that – it can get messy real quickly (like, instantly). Instead, you could store those values as data-* attributes to keep your JS logic separate:

// ...
echo '<input type="button"'
  . ' value="replay"'
  . ' class="replay"'
  . ' data-t1="' . $row['T1'] . '"'
  . ' data-s1="' . $row['s1'] . '">';

You can then access these values in your JS (be sure to include that script at the end of the body so that the DOM is ready when it runs):

// Get a NodeList of all replay-buttons
var replayButtons = document.querySelectorAll('.replay')

// Convert that NodeList to an Array for IE compatibility
// (Yes it's a bit awkward -- we have to "borrow" the .slice()
// method from the Array prototype to this.)
var replayButtonArray = Array.prototype.slice.call(replayButtons)

// Iterate over those buttons
replayButtonArray.forEach(function (button) {

  // Attach a click listener
  button.addEventListener('click', function (event) {
    // Get the values from the data-* attributes
    // of the current button
    var t1 = this.dataset.t1
    var s1 = this.dataset.s1

    // ... do something with t1 and s1
    console.log(t1, s1)
  })
})

Thank you for answering my question.
I will apply your answer
Best wishes for you.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.