ReferenceError: $ is not defined or Uncaught ReferenceError: $ is not defined

Question

I am trying to call a bootstrap model in my page. but it throws an error in console output as ReferenceError: $ is not defined. Code for the reference as below :-

<head>
    <title></title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">        
    <link href="<?php echo base_url(); ?>assets/css/style.css" rel="stylesheet" type="text/css"/>
    <link href="<?php echo base_url(); ?>assets/css/bootstrap.css" rel="stylesheet" type="text/css"/>  
</head>
<body>
<div class="text-center">
    <button class="btn btn-danger" id="delete" > Delete ID</button>
</div>

<div class="modal fade" id="confirm-delete" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            Confirm Delete
        </div>
        <div class="modal-body">Are you sure you want to Delete  contact list ?</div>  
        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
            <a  id="sureDelete"><button  class="btn btn-danger success">Delete</button></a>
        </div>

    </div>
</div>
</div>

    <script type="text/javascript">
        $(document).on('click', '#delete', function () {
        $('#confirm-delete').modal('show');});
    </script>
    <script src="<?php echo base_url(); ?>assets/js/jquery.js" type="text/javascript"></script>
    <script src="<?php echo base_url(); ?>assets/js/bootstrap.min.js" type="text/javascript"></script>
</body>

score 1 · Accepted Answer · answered Apr 23 '16 at 08:12

1

fix your code like this

<script src="<?php echo base_url(); ?>assets/js/jquery.js" type="text/javascript"></script>
<script src="<?php echo base_url(); ?>assets/js/bootstrap.min.js" type="text/javascript"></script>
<script type="text/javascript">
        $(document).on('click', '#delete', function () {
        $('#confirm-delete').modal('show');});
</script>

answered Apr 23 '16 at 08:12

Hakkı

811
2
13
23

Thank you. It works for me !!! – Akhilesh Kumar Apr 23 '16 at 08:16

score 1 · Answer 2 · answered Apr 23 '16 at 08:15

You need add your script order wise.

    <script src="<?php echo base_url(); ?>assets/js/jquery.js" type="text/javascript"></script>
    <script src="<?php echo base_url(); ?>assets/js/bootstrap.min.js" type="text/javascript"></script>
<script type="text/javascript">
        $(document).on('click', '#delete', function () {
        $('#confirm-delete').modal('show');});
    </script>

If it will still give this error use "jQuery" instead of "$"

ReferenceError: $ is not defined or Uncaught ReferenceError: $ is not defined

2 Answers2