Click here to Skip to main content
15,868,016 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
I have the code below
Javascript and HTML

JavaScript
function uppass(e) {
var element = document.getElementById("newclient");
let value = element.innerHTML.replace(/[^0-9]/g, "");
++value;
let newValue=e.id +'  -  ' +value ;
document.getElementById("newclient").innerHTML =  newValue;
}



HTML
<pre><!DOCTYPE HTML>
<html>

<head>
  <title>
    clicked button in JavaScript
  </title>
</head>

<body style="text-align:center;">
  <header>
    <h1> Clicker costumer queue window calling</h1>
  </header>
  <h4>For customers</h4>
  <center>
    <button id="c" class="button" onclick="uppass(this)" style=" font-size: 16px; margin: 0 10px;"> Common </button>
    <button id="f" type="button" onclick="uppass(this)" style=" font-size: 16px; margin: 0 10px;"> Fast </button>
    <button id="p" type="button" onclick="uppass(this)" style=" font-size: 16px; margin: 0 10px;"> Priority </button>
  </center>
  <h5>Your pass is: </h5>
  <h2 id="newclient" style="font-size: 12px; display: inline-block; padding-left: 20px;">0</h5>
<br><br>

<h4>Attendant Call</h4>

<button id="window1" type="button" onclick="funcao()" style=" font-size: 16px; margin: 0 10px;"> Window 1 </button>
  <button id="window2" type="button" onclick="funcao()" style=" font-size: 16px; margin: 0 10px;"> Window 2 </button>
  <button id="window3" type="button" onclick="funcao()" style=" font-size: 16px; margin: 0 10px;"> Window 3 </button>
  <button id="window4" type="button" onclick="funcao()" style=" font-size: 16px; margin: 0 10px;"> Window 4 </button>
</center>

<br><br>
<h5>Calling password number:</h5><h2 id="newclient" style="font-size: 12px; display: inline-block; padding-left: 20px;">0</h5>

</body>

</html>


I'm trying to make "window" call the password created in the "Common", "Fast" and "Priority" buttons.
For example. If the client creates a password in "Common", "priority" or "fast", the "window" will call that password.
But I'm having trouble creating this in javascript, maybe with array, and with the "if" method but it could be another way too.
The hardest part is:
"window1" calls the password "Priority" , if there isn't, it calls the password "Fast", if there isn't, calls the password "common" and if there isn't one, it does nothing. "window2" and "window3" call the password "Fast" , if there isn't, call the password "Priority", if there isn't, call the password "Common" and if there is none, do nothing. "window4" calls the password "Common" , if there isn't one, it calls the password "Priority", if there isn't, it calls the password "Fast" and if there isn't one, it doesn't do anything.

Each "window" has its button. When clicking the button, it verifies the next password to be called, displays the password on the panel, displays the "window" corresponding to the button and removes it from the queue. If there is no password in the queue, it does nothing.

an someone help? Thanks

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

What I have tried:

JavaScript
<pre lang="Javascript">function uppass(e) {
var element = document.getElementById("newclient");
let value = element.innerHTML.replace(/[^0-9]/g, "");
++value;
let newValue=e.id +'  -  ' +value ;
document.getElementById("newclient").innerHTML =  newValue;
}


HTML
<!DOCTYPE HTML>
<html>

<head>
  <title>
    clicked button in JavaScript
  </title>
</head>

<body style="text-align:center;">
  <header>
    <h1> Clicker costumer queue window calling</h1>
  </header>
  <h4>For customers</h4>
  <center>
    <button id="c" class="button" onclick="uppass(this)" style=" font-size: 16px; margin: 0 10px;"> Common </button>
    <button id="f" type="button" onclick="uppass(this)" style=" font-size: 16px; margin: 0 10px;"> Fast </button>
    <button id="p" type="button" onclick="uppass(this)" style=" font-size: 16px; margin: 0 10px;"> Priority </button>
  </center>
  <h5>Your pass is: </h5>
  <h2 id="newclient" style="font-size: 12px; display: inline-block; padding-left: 20px;">0</h5>
<br><br>

<h4>Attendant Call</h4>

<button id="window1" type="button" onclick="funcao()" style=" font-size: 16px; margin: 0 10px;"> Window 1 </button>
  <button id="window2" type="button" onclick="funcao()" style=" font-size: 16px; margin: 0 10px;"> Window 2 </button>
  <button id="window3" type="button" onclick="funcao()" style=" font-size: 16px; margin: 0 10px;"> Window 3 </button>
  <button id="window4" type="button" onclick="funcao()" style=" font-size: 16px; margin: 0 10px;"> Window 4 </button>
</center>

<br><br>
<h5>Calling password number:</h5><h2 id="newclient" style="font-size: 12px; display: inline-block; padding-left: 20px;">0</h5>

</body>

</html>
Posted
Comments
Bob@work 27-Oct-21 18:31pm    
The function called by the window buttons, "funcao", doesn't exist in your javascript.

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



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900