I'm encountering an issue with my JavaScript file where I'm getting the error "Uncaught ReferenceError: $ is not defined" in the browser console. I'm using jQuery in my JavaScript code, but it seems like jQuery is not being recognized.
Here's the relevant portion of my JavaScript file (address.js):
console.log("Hi");
$(document).ready(function(){
$(document).on("click",".make-default-address",function(){
let id = $(this).attr("data-address-id")
let this_val = $(this)
console.log("Id is:", id);
console.log("Element is:", this_val);
$.ajax({
url:"/make-default-address",
data: {
"id":id
},
dataType: "json",
success: function(response){
console.log("Address Made default.....");
if (response.boolean == True){
$(".check").hide()
$(".action_btn").show()
$(".check"+id).show()
$(".button"+id).hide()
}
}
})
})
})
I've ensured that jQuery is loaded before this script in my HTML file:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="{% static 'assets/js/address.js' %}"></script>
However, I'm still getting the error. Can someone please help me understand what might be causing this issue and how I can resolve it?
Any assistance would be greatly appreciated. Thank you!
Top comments (0)