<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jquery examples - 4</title>
<link rel="stylesheet" type="text/css" href="css/style2.css">
</head>
<body>
<input id="name" type="text" name="">
<input id="button" type="button" value="load" name="">
<div id="content"></div>
<script type="text/javascript" src="js/jQuery.js"></script>
<script type="text/javascript" src="js/selectors12.js"></script>
</body>
</html>
$('#button').click(function() {
var name = $('#name').val();
$.ajax({
url:'php/page.php',
data: 'name='+name, //sending the data to page.php
success: function(data) {
$('#content').html(data);
}
}).error(function() {
alert('an error occured');
}).success(function() {
/*alert*/
alert('an error occured');
}).complete(function() {
/*alert*/
});
});
the error()
is not working, when I change the URL: to page.php
with incorrect extension to check for an error()
and display it.
But, in console it displays an error saying:
Uncaught TypeError: $.ajax(...).error is not a function
To solve the "$. ajax is not a function" error, add the regular jQuery script to the page and remove the slim version. The slim jQuery version does not include the ajax function.
This is a standard JavaScript error when trying to call a function before it is defined. This error occurs if you try to execute a function that is not initialized or is not initialized correctly. This means that the expression did not return a function object.
jQuery ajax() MethodThe ajax() method is used to perform an AJAX (asynchronous HTTP) request. All jQuery AJAX methods use the ajax() method. This method is mostly used for requests where the other methods cannot be used.
Since version 3.0, jQuery replaces error()
with fail()
for chained promise call. So you should use
$.ajax({
....
}).done(function(resp){
//do something when ok
}).fail(function(err) {
//do something when something is wrong
}).always(function() {
//do something whether request is ok or fail
});
From jQuery Ajax documentation:
Deprecation Notice: The jqXHR.success(), jqXHR.error(), and jqXHR.complete() callbacks are removed as of jQuery 3.0. You can use jqXHR.done(), jqXHR.fail(), and jqXHR.always() instead.
Maybe you are using the slim build of jquery which does not have ajax function. Try to download the regular one from this link
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With