Not getting jQuery.extend options correctly inside an event

Not getting jQuery.extend options correctly inside an event

I'm trying to create a plugin with some form processing & i need to call a success function if form submitted correctly. I used  $.extend to extend the options. 

  1. function Foo(elem,options){
  3. var self = this;
  4. $elem = $(elem);
  5. settings = $.extend({}, $.fn.test.defaults, options);
  6. self.init();
  7. }

  9. Foo.prototype.init = function(){
  11. $elem.on('click', function(e){
  12. e.preventDefault();
  13. if(typeof settings.onSuccess === 'function' ){
  14. settings.onSuccess.call(this);
  15. }
  16. });
  17. }

  19. $.fn.test = function(options) {
  20.     
  21. return this.each(function(){
  22. var element = $(this);
  24. var form = new Foo(this, options);
  26. });

  28. };

  30. $.fn.test.defaults = {
  31. onSuccess : null
  32. };
i created two forms and called two different functions for these form onSuccess .

  1. <form id="form1">
  2. <input type="text" name="input1" />
  3.     <input type="submit" name="submit1" />
  4. </form>

  6. <form id="form2">
  7. <input type="text" name="input2" />
  8.     <input type="submit" name="submit2" />
  9. </form>

  12. (function($){
  13. $('#form1').test({
  14. onSuccess : function(){alert('form1 submitted');}
  15. });
  16. $('#form2').test({
  17. onSuccess : function(){alert('form2 submitted');}
  18. });
  19. })(jQuery);

but while submitting both forms only executes the last extended function. ie, alert ('form2 submitted'). 

but when calling outside of submit function, it works....

Please anyone help me to findout what's the actual problem...