2

I have read this: Uncaught ReferenceError: jQuery is not defined

Which led me to this: Uncaught ReferenceError: $ is not defined?

After understanding the problem that I was not referencing jQuery before I was using it I changed my code.

From this:

<head>
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css" rel="stylesheet" />
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head>

I moved jQuery to the top like this:

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css" rel="stylesheet" />
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script>
</head>

That fixed my first Uncaught ReferenceError. I am however still getting the same error but from select2.

Uncaught ReferenceError: jQuery is not defined
    <anonymous> https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js:2
    <anonymous> https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js:2
select2.min.js:2:83

I do not know how to reference it any sooner and ever their own page shows how to setup the code.

2 Answers 2

3

It turns out I tried to use select2 in my base.html file. I never referenced jQuary there.

base.html before:

  <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css" rel="stylesheet" />
  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script>

And after:

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
  <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css" rel="stylesheet" />
  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script>

Small mistake that will hopefully save you 30 minutes of work. Check everything.

Sign up to request clarification or add additional context in comments.

Comments

0

I encountered the same issue, make sure you load Jquery before any scripts. You can place it on HTML head tag

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.