Javascript clicker costumer queue identify buttons

Question

0.00/5 (No votes)

See more:

, +

I have the code below
Javascript and HTML

I am implementing buttons for a queue of customers, each button that is clicked will increase a number. Until then I managed to solve. I want to identify each button that is clicked.
For example. When clicking on "common", the letter "c" appears in front of the number, when clicking on "fast" the letter "f" and "priority" the letter "p". but the numbers are still in sequence.
For example. clicking buttons randomly
c - 1
f - 2
c - 3
p - 4
f - 5
f - 6
c - 7
and so on.
I managed to make the buttons and count, but I can't identify each one. Can someone help? Thanks.

Code on https://jsfiddle.net/t8y31fo5/

What I have tried:

HTML

<pre><!DOCTYPE HTML>
<html>
    <head>
        <title>
            clicked button in JavaScript
        </title>
    </head>

    <body style = "text-align:center;">
<header>
  <h1> Clicker costumer queue identify button</h1>
</header>
<center>
  <button  id="c" class="button" onclick="uppass()" style=" font-size: 16px; margin: 0 10px;"> Common </button>
    <button id="f" type="button" onclick="uppass()" style=" font-size: 16px; margin: 0 10px;"> Fast </button>
    <button id="p" type="button" onclick="uppass()" style=" font-size: 16px; margin: 0 10px;"> Priority </button>
</center>
<h5>Sua senha é:</h5><h2 id="newclient" style="font-size: 12px; display: inline-block; padding-left: 20px;">0</h5>
</body>
</html>

JavaScript

function uppass () {
var element = document.getElementById("newclient");
var value = element.innerHTML;

++value;

console.log(value);
document.getElementById("newclient").innerHTML = value;
}

Posted 13-Jul-21 4:38am

markmark01

Updated 13-Jul-21 6:21am

Add a Solution

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Chris Copeland · Answer 1 · 2021-07-13T06:21:00

All of your buttons are making calls to the JS uppass() method, but how do you identify which of the buttons made the click? You can add support for this by adding a parameter to your method:

JavaScript

function uppass (key) {

Then you can pass the value in when the button is clicked. You can either do it manually:

JavaScript

<button .. onclick="uppass('c')">

Or you can use the id attributes you've added to your buttons:

JavaScript

<button id="c" .. onclick="uppass(this.id)">

JavaScript Function Parameters[^]
Functions - JavaScript | MDN[^]