I am looking to get an alert when click on submit button, but getting error when page loads: Uncaught ReferenceError: JQuery is not defined
I’m beginner at front-end development, trying to learn javascript and JQuery, can anyone help to fix? Also what went wrong?
html code:
<section>
<div>
<div class="row text-center">
<div class="col-sm-12 text-center">
<div class="row">
<div class="col-sm-8 col-sm-offset-2">
<div>
<h2>CONTACT US</h2>
</div>
<form id="contactForm">
<input type="hidden" data-form-email="true">
<div class="form-group">
<input type="text" class="form-control" name="name" required="" placeholder="Name*" data-form-field="Name">
</div>
<div class="form-group">
<input type="email" class="form-control" name="email" required="" placeholder="Email*" data-form-field="Email">
</div>
<div>
<input type="submit" id="submit" name="submit" class="btn btn-lg btn-danger">
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</section>
Script:
<script>
JQuery('#contactForm').submit(function(){
event.preventDefault();
alert('Working');
});
</script>
When I checked page source:
<script src='https://yourdevweb.com/testing/wp-includes/js/jquery/jquery.min.js?ver=3.6.0' id='jquery-core-js'></script>
<script src='https://yourdevweb.com/testing/wp-includes/js/jquery/jquery-migrate.min.js?ver=3.3.2' id='jquery-migrate-js'></script>
>Solution :
It is a typo mistake. Replace JQuery to jQuery will solve the problem.