0

Firstly, I want to make sure that you know that I know that stackoverflow is filled with topics related to my issue, however I have looked through them and literally none of them seem to relate to my issue.

I am a complete noob when it comes to javascript, however I am good in Googling and analyzing/adjusting free-to-use codes so that it works for me (until now...)

The initial project was a calculation form which I got to work the way I wanted it. Now I want to show a value right under the dropdown boxes in the top of the page, since each choice needs an accompanying comment.

I have literally copy-pasted a piece of code I found through StackOverflow which works perfectly fine in JSFiddle: http://jsfiddle.net/irama/ZFzrA/2/

hideAllDivs = function () {
$("#hourly").hide();
$("#per_diem").hide();
$("#fixed").hide();
};

handleNewSelection = function () {

hideAllDivs();

switch ($(this).val()) {
    case '1':
        $("#hourly").show();
    break;
    case '2':
        $("#per_diem").show();
    break;
    case '3':
        $("#fixed").show();
    break;
}
};

$(document).ready(function() {

$("#project_billing_code_id").change(handleNewSelection);

// Run the event handler once now to ensure everything is as it should be
handleNewSelection.apply($("#project_billing_code_id"));

});

However, when I add it to my existing code and upload the changes, I receive the reference error in my browser and the div's under the dropdown box show by default.

My complete code: https://jsfiddle.net/ohwwzo7q/

So basically my question is where did it go wrong?

P.S. My calculator doesn't work probably because of the error, when I remove the extra code it does work again however.

Yassine Lamlih
  • 15
  • 7
  • 4
    try to include jQuery... : https://jsfiddle.net/ohwwzo7q/1/ – cl3m Mar 07 '16 at 15:14
  • your fiddle also gives error because you did not click the [JavaScript *] thingy and choose jQuery and "in head": https://jsfiddle.net/mplungjan/nL4c2kss/ – mplungjan Mar 07 '16 at 15:20
  • Thanks for your quick response, the jquery part is new to me and now I understand why I have been seeing it so much. – Yassine Lamlih Mar 07 '16 at 16:00

1 Answers1

0

You need to include jquery as a dependency to use $

You can either download a version from the jquery website, or use a CDN. Either way, it can be included like this:

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
</head>
millerbr
  • 2,951
  • 1
  • 14
  • 25