Lazloman
Lazloman

Reputation: 1347

$.post fails with error "...is not a function"

Here is my code:

var jqxhr = $.post("mypage.php", {url:pageurl}, function() {
      alert("fetching...");
})
.success(function() { alert("fetch complete!"); })
.error(function() { alert("error!"); })
.complete(function() { alert("complete"); });

// Set another completion function for the request above
jqxhr.complete(function(){ alert("second complete"); });

I get the alert("Fetching...") dialog box, but the rest of the code does not complete. I get the error: Error: $.post("sec_fetch_report.php", function () {alert("fetching...");}).success is not a function

I thought maybe I might be missing the jquery libs, but I have another function that calls $.post and it runs just fine. Is there a syntax error I'm missing somewhere or what? Thanks

Upvotes: 3

Views: 14111

Answers (5)

Surbowl
Surbowl

Reputation: 249

Ref: https://api.jquery.com/jQuery.post/

As of jQuery 1.5, all of jQuery's Ajax methods return a superset of the XMLHTTPRequest object. This jQuery XHR object, or "jqXHR," returned by $.post() implements the Promise interface, giving it all the properties, methods, and behavior of a Promise ......

The Promise interface also allows jQuery's Ajax methods, including $.get(), to chain multiple .done(), .fail(), and .always() callbacks on a single request, and even to assign these callbacks after the request may have completed. If the request is already complete, the callback is fired immediately.

// Assign handlers immediately after making the request,
// and remember the jqxhr object for this request
var jqxhr = $.post( "example.php", function() {
  alert( "success" );
})
  .done(function() {
    alert( "second success" );
  })
  .fail(function() {
    alert( "error" );
  })
  .always(function() {
    alert( "finished" );
  });

Upvotes: 0

Scherbius.com
Scherbius.com

Reputation: 3414

See examples here: jQuery.post

also, you may get error like that if you've forgotten to link jQuery library

Upvotes: 0

ehynds
ehynds

Reputation: 4463

That syntax is only supported in jQuery 1.5+ (with the introduction of deferreds). It sounds like you're using a earlier version of jQuery. If you aren't able to upgrade, pass the success/error/complete handlers as methods of the options object (like in Tejs's example).

Upvotes: 2

Gary Green
Gary Green

Reputation: 22395

The jqxhr object is chainable from v1.5. Make sure you have this version or later.

Ref: jQuery 1.5 released, now with Deferred Objects

Upvotes: 1

Tejs
Tejs

Reputation: 41246

Your syntax is broken. What you're attempting to do is call the .success property of the $.post() method, which obviously doesnt exist. It looks like you also need to be using the $.ajax method instead of $.post:

 $.ajax({
     type: 'POST',
     url: 'mypage.php',
     data: { url: pageurl },
     beforeSend: function()
     {
         alert('Fetching....');
     },
     success: function()
     {
         alert('Fetch Complete');
     },
     error: function()
     {
         alert('Error');
     },
     complete: function()
     {
         alert('Complete')
     }
 });

Upvotes: 6

Related Questions