Question

I am trying to create a generic function using jQuery but for some reason its not getting invoked. When I added alerts as shown below, the first alert 'My plugin invoked' pops up but the second 'Submitting' doesn’t pop up.

Any help is greatly appreciated.
Thanks

$(document).ready(function() {

  jQuery.fn.ajaxFormSubmit = function(parameter1, parameter2) {
    alert('My plugin invoked...');
      this.submit(function(e) {
          alert('Submitting.......');
          $.ajax({ 
              url: "/Servletpath",
              dataType: "json",
              data: { //data
                    },

              success:  (function(data) {
                            alert('success');
                        }),  
              error:    (function() { 
                            alert('error');
                        })          
            });
          return false;
      });
  };

  $("#search").live("click", function() {
      var parameter1 = $("#id1").val();
      var parameter2 = $("#id2").val();
      $("#form_id").ajaxFormSubmit(parameter1, parameter2);
      return false;
  });
});

Answer 1

this.submit(function() {...}) will not trigger the submit. It will wait for the form to submit and then invoke the callback. This would help

this.submit(function(e) {
    ...
}).trigger('submit');

or just

  jQuery.fn.ajaxFormSubmit = function(parameter1, parameter2) {
    alert('My plugin invoked...');
    alert('Submitting.......');
    $.ajax({ 
        url: "/Servletpath",
        dataType: "json",
        data: { //data
              },
        success:  function(data) {
                        alert('success');
                    },  
          error:    function() { 
                        alert('error');
                    }          
        });
  };