I need help with Calculator jQuery

Back End Help
#1

Hi everyone,

I rebuild a very basic calculator and I really struck. I can display the numbers in an array with map() but I could not display the operators an array with map(). Can anyone point me out how to solve this issue please?

Please ignore the design for now.

#2

i get what your trying to do, so you have an array of numbers and array of symbols and when clicked it matches the the array number to the id then pushes it to results? well the problem you had with the symbols is that the array you have does not match the id’s in the html.
A better way of doing this would be to iterate through all the buttons and when a button is clicked send the value to the results array…

 $('.bt').each((i, el) => {
    $(el).on('click', () => {
      result.push(el.value)
      $("#input").html(result);
    })
  })

this should solve your problem just remove bt class from ce button, hope this helps :slightly_smiling_face:

#3

@biscuitmanz Thank you for your solution.

Even thought I changed the IDs to matched with the array it was not working. Please see my code what should I resolve it.

HTML example:

<button id="+" class="operator bt" value="+">+</button>

JavaScript code:

 ["+", "-", "/", "*"].map(op => {
    let selector = "#" + op;
    $(selector).on("click", function() {
      result.push(op);
      console.log(result);
      $("#input").html(result);
    });
  });
#4

you dont need this function anymore as the one i provided does all buttons…

but if you still want to use this function

["plus", "minus", "devide", "multiply"].map(op => {
    let selector = "#" + op;
    $(selector).on("click", function(e) {
      result.push(e.currentTarget.innerText);
      
      $("#input").html(result);
    });
  });
#5

Thank you @biscuitmanz It is working correctly:grin:

1 Like