HiveBrain v1.2.0
Get Started
← Back to all entries
patternjavascriptMinor

jQuery plugIn to manage forms

Submitted by: @import:stackexchange-codereview··
0
Viewed 0 times
formspluginjquerymanage

Problem

I have just created my first jQuery plugin. I am looking to suggestions on how to improve it, leading to a code optimization.

```
(function($) {
var plugin_name = 'W.jQuery.FieldEvents';
var name_space = 'wFieldEvents';
var methods = {
init : function(options) {
return this.each(function(){
var field = $(this);
var settings = {
'edit_button' : '',
'submit_button':'',
'error_message':'value not found',
callback:function(){
alert('no call back defined for'+field.attr('id'))
}
};
settings = $.extend(settings, options);
var data = field.data(name_space);
var edit_button = $(settings.edit_button);
var submit_button = $(settings.submit_button);
if (!data) {
$(this).data(name_space, {
submit_button : submit_button,
edit_button :edit_button,
callback:settings.callback,
error_message:settings.error_message
});
}
methods.enable_submit.call(field);
});
},
disable_edit: function(){
return this.each(function(){
var field = $(this);
var data = field.data(name_space);
//alert(data.edit_button.attr('id'));
data.edit_button.attr('disabled','disabled').off('click.'+name_space).addClass('ui-state-disabled');
});
},
enable_submit : function()
{
return this.each(function(){
var field = $(this);
var data = field.data(name_space);
//alert('working');
//alert('enabled submit called for '+field.attr('id'));
methods.disable_edit.call(field);
field.removeAttr('disabled');
data.submit_button.removeAttr('disabled').removeClass('ui-state-disabled');
da

Solution

You can refactor the init function.

init : function(options) {
         var defaults = {
           'edit_button' : '',
           'submit_button':'',
           'error_message':'value not found'
          };
          options = $.extend({}, defaults, options);
         return this.each(function(){
            var field = $(this);
            if (!options.hasOwnProperty('callback') ) {
              options.callback = function(){
                alert('no call back defined for'+field.attr('id'))
              }
            }             
            var data = field.data(name_space);
            var edit_button = $(options.edit_button);
            var submit_button = $(options.submit_button);
            if (!data) {
               $(this).data(name_space, {
                  submit_button : submit_button,
                  edit_button :edit_button,
                  callback:options.callback,
                  error_message:options.error_message
               });
            }
            methods.enable_submit.call(field);
         });
      },


As Flambino mentioned run your code through JSlint

Code Snippets

init : function(options) {
         var defaults = {
           'edit_button' : '',
           'submit_button':'',
           'error_message':'value not found'
          };
          options = $.extend({}, defaults, options);
         return this.each(function(){
            var field = $(this);
            if (!options.hasOwnProperty('callback') ) {
              options.callback = function(){
                alert('no call back defined for'+field.attr('id'))
              }
            }             
            var data = field.data(name_space);
            var edit_button = $(options.edit_button);
            var submit_button = $(options.submit_button);
            if (!data) {
               $(this).data(name_space, {
                  submit_button : submit_button,
                  edit_button :edit_button,
                  callback:options.callback,
                  error_message:options.error_message
               });
            }
            methods.enable_submit.call(field);
         });
      },

Context

StackExchange Code Review Q#16401, answer score: 3

Revisions (0)

No revisions yet.