How to get values dynamically in js from php?

Question

I want to get dynamic values from php in js in a dynamic manner...Let me elaborate: First I show the image then code:

<div id="">
 <table border="1" width="820" style="margin-left:15px;">
      <tr>
      <th>Sr #</th>
      <th>Commented Post</th>
      <th>Commenter Name</th>
      <th>Commenter Email</th>
      <th>Comments</th>
      <th>Status</th>
     </tr>

     <?php 

     $values = array();

     while($row= mysqli_fetch_assoc($res)) { 
              $values[] = $row['comment_id']; 

              ?>
          <tr align="center" style="height:50px;">
            <td><?php echo $row['comment_id']; ?></td>
            <td><?php echo $row['post_title']; ?></td>
            <td><?php echo $row['comment_name']; ?></td>
            <td><?php echo $row['comment_email']; ?></td>
            <td><?php echo $row['comment_text']; ?></td>
            <td>
          <?php 
          if($row['status']==0) { ?>
            <div class="status_<?php echo $row['comment_id']; ?>" id="status_<?php echo $row['comment_id']; ?>"><a href="#" style="border-bottom:dotted 2px #0033FF ; text-decoration:none">Unapproved</a></div>    
            <?php  } else { ?>
              Approved
            <?php } ?>

            </td>

          </tr>  

       <?php } 



       ?>


     </table>


     </div>

And Js here's:

<script type="text/javascript">

 $(document).ready(function(){
     var values = <?php echo json_encode($values); ?>; 

        var id = values[0];

        $('.status_'+id).click(function(){
        $("#status_"+id).html("<b>Test</b>");
         });

     var i = values[1];

        $('.status_'+i).click(function(){
        $("#status_"+i).html("<b>Test</b>");
         });

    });
 </script>

I want to get all comment id's in js dynamically, so that on clicking each row link, it changes to text "Test"...As I have written the js code manually...how we obtain all the comment_id's dynamically in js..I hope you got the idea what I am trying to do...

I would dump the $values into a PHP comma delimited string first. Then grab that in JS and split it into values. — durbnpoisn
– durbnpoisn, Commented Feb 23, 2016 at 15:48

Marc B · Accepted Answer · 2016-02-23 15:49:38Z

2

There's no point in assigning unique ids to each of your elements. Why not do something like:

<tr>
  <td>...</td>
  <td><a href="#" onclick="toggle(this, <?php echo $id ?>)">Unapproved</td>
</tr>

then something like

function toggle(node, id) {
   node.parentNode.innerHTML = '<b>test</b>';
   ... do something with "id" value? ...
}

No need for getElementById, assigning a massive pile of repetitive ids, etc.. just a single function call and a bit of DOM tree traversal.

answered Feb 23, 2016 at 15:49

Marc B

362k44 gold badges433 silver badges508 bronze badges

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

Comments

Ben · Accepted Answer · 2016-02-23 15:50:48Z

0

Try to add a class to your status TD, like <td class="status" data-id="<?php echo $row['comment_id'] ?>">// your inital value</td>.

Using jQuery you can easily listen for events which are attached to a an event listener:

$(document).on('click', '.status', function() { 
  var id = $(this).attr('data-id');
  $(this).html('<strong>Test</strong>');

  // maybe to something with ajax?
  $.ajax({
    url: 'yourfile.php?call=doSomething&id=' + id,
    type: 'post'
  }).done(function(response) { 
    // console.log(response);
  });
});

answered Feb 23, 2016 at 15:50

Ben

11.3k19 gold badges80 silver badges140 bronze badges

2 Comments

user5122725 Over a year ago

@Ben...Thank you very much...I am unaware of data-id attribute..so its increases my knowledge.

Ben Over a year ago

No problem. By the way, you can define as many custom attributes prefixed by data as you need. Good luck on the implementation. Ciao.

Steve · Accepted Answer · 2016-02-23 15:49:31Z

0

You dont appear to actually use the ids. All you need to do is ascertain the clicked element, which use can do using this

html:

<div class="status"><a href="#" style="border-bottom:dotted 2px #0033FF ; text-decoration:none">Unapproved</a></div>

js:

 $(document).ready(function(){

    $('.status').click(function(){
        $(this).html("<b>Test</b>");
     });
});

answered Feb 23, 2016 at 15:49

Steve

20.5k5 gold badges47 silver badges71 bronze badges

Collectives™ on Stack Overflow

How to get values dynamically in js from php?

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related