CODEWITHSUNDEEP
javascriptphpjqueryajaxlaravel
Varadegowda V
Varadegowda V

Reputation: 55

In laravel blade page saying $.ajax is not a function

In laravel I used to call ajax for my select box(it is like binary tree, ex: cat1,cat2 are parent id then cat3,cat4,cat5 are childs of parent cat1, cat6,cat7 are childs of cat2 and so on..). Onchange function is also working, but showing ajax error Uncaught TypeError: $.ajax is not a function

This is my script

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<meta name="csrf-token" content="{{ csrf_token() }}" />
<script>
var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
function fun_end_cat(cat_id)
{
//alert("test");
    var cat=cat_id.value;
    $.ajax({
           url: '/postajax',
           type: 'POST',
           data: {_token: CSRF_TOKEN, message:cat},
           dataType: 'JSON',
           success: function (data) { 
                 alert(data);
             }
           }); 
} 
</script>

this my select box

<select class="form-control" name="cat_name" required onchange="fun_end_cat(this)">
    <option value="">Select Category</option>
    <option value="cat1">cat1</option>
    <option value="cat1">cat1</option>
</select>

Upvotes: 5

Views: 1843

Answers (2)

Farooq Ahmed Khan
Farooq Ahmed Khan

Reputation: 4094

You can use it like this, $ sign might be conflicting with other libs you are using on the page.

$.noConflict(); // it resolves $ issues so that other libraries using $ work seamlessly

jQuery.ajax(function(){
    // use jQuery instead of $
});

Upvotes: 5

Arman Bagheri
Arman Bagheri

Reputation: 630

refactor your code to below code

<select class="form-control change" name="cat_name" required>
    <option value="">Select Category</option>
    <option value="cat1">cat1</option>
    <option value="cat1">cat1</option>
</select>

js code

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
var CSRF_TOKEN = {{ csrf_token() }};
    $('.change').change(function(){
  var cat= cat_id.value;
  $.ajax({
    url: '/postajax',
    type: 'POST',
    data: {
      _token: CSRF_TOKEN,
      message:cat
    },
    dataType: 'JSON',
    success: function (data) { 
      alert(data);
    }
  }); 
})
</script>

idon't know what is cat_id but your change method should be like this

Upvotes: 0

Related Questions