Get value from dynamically created button

Question

I am getting dynamic buttons from database the thing is,I want to use the value from the created button to fetch data,but when I click the button,on the value of the first button is passed even when i click a different button.here is my js code to get the button value.

function prodata1()
     {
       $(document).ready(function(){
           $("#show").click(function(){
                 var show=$("#show").val();
                 $.ajax({
                    type:"post",
                    url:"assets/exec/compare-exec.php",
                    data:"show="+show,
                    success:function(data){
                    $("#link2").html(data);
                    }
                   });
              });
         });
       }

Could you show us what these dynamically created buttons look like in html? — Sean Huber
– Sean Huber, Commented Aug 6, 2015 at 4:26
while($data=$stmt->fetch()) { extract($data); ?> <div align="left"> <span class="name"><?php echo $data['pname']; ?></span> <br/><?php echo $data['pmanu']; ?><br/>  <button id = "show" name="show"value="<?php echo $data['pid']; ?>" onclick="javascript:prodata1()">clickme</button> <a class="btn btn-success" value= "<?php echo $data['pid']; ?>" ><?php echo $data['pid']; ?></a> </div> <?php } — Seffu
– Seffu, Commented Aug 6, 2015 at 4:29
Please update the question with the code instead of commenting it, reading the structure is difficult in comments — Bankzilla
– Bankzilla, Commented Aug 6, 2015 at 4:29
use firebug to see the ajaxs input and output, it will better help you with why something isnt working right. — Exploit
– Exploit, Commented Aug 6, 2015 at 4:55

Al Amin Chayan · Accepted Answer · 2015-08-06 04:28:58Z

3

Probably you are using same id(#show) in all buttons. ID must be unique in a page. Give different names in id or try to use class. and change your code to:

    function prodata1()
    {
       $(document).ready(function(){
           $(".show").click(function(){
                 var show=$(this).val();
                 $.ajax({
                    type:"post",
                    url:"assets/exec/compare-exec.php",
                    data:"show="+show,
                    success:function(data){
                    $("#link2").html(data);
                    }
                   });
              });
         });
       }

answered Aug 6, 2015 at 4:28

Al Amin Chayan

2,5004 gold badges26 silver badges43 bronze badges

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

1 Comment

Seffu Over a year ago

Thanks alot guys.chayan's answer has helped me out.Thanks alot guys you are the best.

Bankzilla · Accepted Answer · 2015-08-06 04:37:21Z

You have a lot of unnecessary code in there, this should work. You shouldn't have more than 1 element with the same ID.

I've changed the ID to a class and also passing in the element reference on the click

<button class="show" name="show"value="<?php echo $data['pid']; ?>" onclick="javascript:prodata1(this)">clickme</button>

Capturing the click with e you can easily get the value with e.value, also the way you had structured the data was incorrect.

function prodata1(e) {
  $.ajax({
    type:"post",
    url:"assets/exec/compare-exec.php",
    data: {show: e.value},
    success:function(data){
      $("#link2").html(data);
    }
  });
}

Collectives™ on Stack Overflow

Get value from dynamically created button

2 Answers 2

1 Comment

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Related