CODEWITHSUNDEEP
javascriptjquery
Ørjan Pettersen
Ørjan Pettersen

Reputation: 33

Javascript, get the name of a clicked button

Trying to get the id or name of the button that has been clicked. But I only get an undefined message in the popup when I try to access the id or name of the button. Could someone point me in the right direction to get this working?

<!DOCTYPE html PUBLIC "-//W2C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Testing : Buttons</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
</head>

<div id="buttons" style="width:100%;height:100%">
    <p id="custom_buttons" >
    </p>
</div>

<div id="footer">
</div>

<script type="text/javascript">
$(function() {
    var datasetPresets = ["Python", "Java", "C++"];
    var datasetPresetsContainer = $("#custom_buttons");
    $.each(datasetPresets, function(index, value) {
        datasetPresetsContainer.append("<button class=std_buttons value=" + value + ">" + value + "</button>");
    });

    $("button.std_buttons").click(function () {
        var button = $(this);
        alert(button.id);
    });

});

</script>
</body>
</html>
</html

Upvotes: 3

Views: 47802

Answers (4)

Sajjad Ashraf
Sajjad Ashraf

Reputation: 3844

In pure javascript, you would do something like this

$("button.std_buttons").click(function (event) {
    var button = event.target;
    alert(button.id);
});

read more about event object here https://developer.mozilla.org/en/docs/Web/API/Event

Upvotes: 4

bosnjak
bosnjak

Reputation: 8614

Basically, try

alert(this.id);

instead of

alert(button.id);

But this question shows a minimum research effort, because it has been answered multiple times here, and a simple search would suffice:

How to get ID of button user just clicked?

Getting the ID of the element that fired an event

Get id of element on button click using jquery

how to get the id when a certain button is clicked using jquery

Upvotes: 7

Vinay Pratap Singh Bhadauria
Vinay Pratap Singh Bhadauria

Reputation: 9947

you just use attr(), the properties are accessed using the attr("property name") in jquery

button.attr('id');

or just

 $(this).id

Upvotes: 0

Felix
Felix

Reputation: 38102

You need to use attr() to get the id of your button because button is a jQuery object:

alert(button.attr('id');

or you can keep your selector but do not convert it to jQuery object:

var button = this;
alert(button.id);

Upvotes: 0

Related Questions