2

I'm trying to find a validator in JS to check if a operator has been used or not ( we're making a simple calculator)so I tried to make a Function checkOperator(), But it was a dead-end and when I used it, it doesnt do anything.

function checkOperator(){
     var operation = document.getElementsByClassName("operator");
     var string = document.getElementsByName('show');
     var lastChar = string.charAt(string.length-1);
 
     if(lastChar === operation){
         var restring =string.replace(operation,operation);
         return restring;
     }
}
    <div id="cursor" class="rekenmachine">
          <form name="rekenmachine">     
            <div>
              <input id="cursor" type="text" name="show" value="">
              <input id="cursor" type="button" name="Clear" value="C" onclick="rekenmachine.show.value =''">
            </div>
            <div class="input">
              <input id="cursor" type="button" value="7" onclick="rekenmachine.show.value +='7'">
              <input id="cursor" type="button" value="8" onclick="rekenmachine.show.value +='8'">
              <input id="cursor" type="button" value="9" onclick="rekenmachine.show.value +='9'">
              <input id="cursor" type="button" class="operator" value="/" onclick="rekenmachine.show.value +='/'">
            </div>
         </form>
    </div>

I expected to only be able to Put one operator, since Eval can't calculate the string if there are multiple operators next to each other.

Fabio_MO
  • 713
  • 1
  • 13
  • 26
Laurent Luypaert
  • 1,812
  • 1
  • 6
  • 9

2 Answers2

0
function checkOperator(){
  var operation = document.getElementsByClassName("operator");
  var string = document.getElementsByName('show')[0].value;
  console.log(string);
  if(string.indexOf('/') > -1){
     // here you can do what you want
     alert('yes'); 
   }else{
     alert('no');
   } 
 }
 $(document).ready(function(){
    $(document).click(function(){
       checkOperator();
     });

 });
Balwinder
  • 72
  • 1
  • 9
  • I think OP wants to prevent things like `8100//9`. It seems to me your solution is preventing `8100/9/9`, which seems valid. – Pac0 Jan 31 '19 at 14:43
0

Main problem in your code is that you need to use value (and [0]) to access the actual text of (the first) element of getElementsByName or getElementsByClassName. See How do I get the value of text input field using JavaScript? .

(I recommend to use an id and getElementById() to get a unique element and avoid having to use [0])

Also, it's a bad idea in my opinion to use "string" as an identifier.

function checkOperator(){
     var elementShow = document.getElementsByName('show')[0];
     var text = elementShow.value;
     var lastChar = text.charAt(text.length-1);
 
     if(lastChar !== '/'){
         elementShow.value = text + '/'
     }
}
<div id="cursor" class="rekenmachine">
          <form name="rekenmachine">     
            <div>
              <input id="cursor" type="text" name="show" value="">
              <input id="cursor" type="button" name="Clear" value="C" onclick="rekenmachine.show.value =''">
            </div>
            <div class="input">
              <input id="cursor" type="button" value="7" onclick="rekenmachine.show.value +='7'">
              <input id="cursor" type="button" value="8" onclick="rekenmachine.show.value +='8'">
              <input id="cursor" type="button" value="9" onclick="rekenmachine.show.value +='9'">
              <input id="cursor" type="button" class="operator" value="/" onclick="checkOperator()">
            </div>
         </form>
    </div>

Remark :

I simplified the logic by explicitly using '/' here.

You can get the operator using document.getElementsByClassName("operator")[0].value; however if you have several operators the logic will be a bit more complicated than that. (since you don't just want to test for repetitions of the same operators, you cannot have +-/ the same as you can't have //.

But that would be something for another question ;)

Pac0
  • 21,465
  • 8
  • 65
  • 74