0

I want to trigger one function every time that the user types something in one of my desire elements (username, password or confirmation) for that, I try to implement this line of code:

//Disabling or enabling button depending on the inputs
$('#username, #password, #confirmation').on('input', () => {
//Enabling button only if inputs are valid
if ($('#username').valid && $("#password").valid && $("#confirmation").valid) {
    if ($('#button').prop('disabled')) $('#button').prop('disabled', false);
}
else if (!$('#button').prop('disabled')) $('#button').prop('disabled', true);
})

This line:

$('#username, #password, #confirmation').on('input', () => {

Seems don't work. Maybe my syntax Is it wrong?? every time that I try to implement this line, I have the same output:

register.js:111 Uncaught TypeError: $(...).on(...) is not a function
at HTMLDocument.<anonymous> (register.js:111)
at j (jquery-latest.min.js:2)
at Object.fireWith [as resolveWith] (jquery-latest.min.js:2)
at Function.ready (jquery-latest.min.js:2)
at HTMLDocument.J (jquery-latest.min.js:2)

enter image description here

I'm sure that the problem occurs because the line that I mentioned because before that line, I didn't have any error, start to appears when I try to implement that three elements and one event handler functionality

I search a little about the problem and the possible reasons that I encountered were:

  • I'm using an older version of jQuery.
  • I'm using a library that makes use of the $ symbol, and I'm including that library after jQuery

Nevertheless, neither reason is my case, I'm sure about that, you can see how I import my jQuery code: 

  <!-- Boostrap JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>

Some idea about my problem?? Maybe I have to implement this code in a different way, can someone help me to do that in good practice way?

For those that want to see all my code, here it is:

https://gist.github.com/HereFrank/c1dd574e7d7bcf57129df72310756731

You can skip the helper.js file, I don't think it's relevant to the problem, but I gave it to you to check anyway if you like.

Improve this question

1 Answer 1

Reset to default
1

Use semicolon wherever you mean it. Your IIFE is interpreted as a function call, like

some_expression
// missing semicolon here leads to misinterpretation
(function(){ /* do something */ }());
Improve this answer
8
  • WOW, that solves my problem immediately, but now I'm scared of what can happen for only losing a semicolon. When I use JavaScript nothing seems to warn me that I omitted a one, it's different when we work with C when the compiler always drop an error if I skip one semicolon. There's no way to do something like that in JavaScript? Sometimes It's a little difficult don't forget that.
    – Frank Agraz
    Commented Apr 16, 2019 at 11:43
  • Correct, in C it would be a compile-time error (but there are many mistakes in C that will still compile). Approaches like TypeScript (a language that transpiles to JavaScript) can fix a few mistakes (but not all people think it's matching the spirit of JS), and the transpiler might be able to spot that the result of the expression is not a function. However, if the expression over the IIFE evaluated to a function, then this wouldn't even lead to an error message at that line, more likely in the accidentally called function. So the flexibility gives new error types.
    – Blauelf
    Commented Apr 16, 2019 at 16:09
  • Yeah, but in C I remember that at least the compiler told me the line where the problem was on, or maybe what caused it (in this case, the semicolon ). So, if I understand, I can use other tools or lenguages like TypeScript to detect the error, but that just will give me another type of error, don't will tell me the syntax error by itself. So in JavaScript, I have always be aware of the syntax, because sometimes there's no direct way to know where the error comes from. Nevertheless, I will have a kind of indirect error that can lead me to the origin of the problem. Did I get it right?
    – Frank Agraz
    Commented Apr 17, 2019 at 12:50
  • The issue in JS cannot happen in C as there's no direct way to call a function that way. A variable can hold a function pointer, but not a function. So there's no need for the compiler to consider an additional pair of parentheses potentially valid.
    – Blauelf
    Commented Apr 17, 2019 at 13:19
  • I think that I don't understand so well your explanations. The functionality of JavaScript (like the ability to use IIFE) can sometimes lead in a misinterpretation by the interpreter (like happen to me for the syntax error), that doesn't happen in C because don't have that functionality. Am I right?Another thing that I still don't understand: you say that my IIFE was interpreted as a function call, but, an IIFE Is it not considered as a function call?, Is because is executed immediately? , so don't exist "a call". Or you try to say me that some_expression was interpreted as a function call?
    – Frank Agraz
    Commented Apr 17, 2019 at 18:10

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .