Edit Here Plugin

editHere.js

/**
 * Created with JetBrains PhpStorm.
 * User: anderson.mota
 * Date: 11/23/12
 * Time: 4:48 PM
 * To change this template use File | Settings | File Templates.
 */

$.fn.editHere = function(action, callback, options){

    var dblclick = true;

    options.style = options.style || {};
    options.typeField = options.typeField || 'text';

    $(document).on('dblclick', $(this).selector, function(){

        var id/* = $(this).parent().data('id')*/;
        var name;
        var value;
        var process = true;
        var input;
        var field;
        var $self = $(this);

        if(dblclick){
            dblclick = false;
            value = $self.text().trim();
            name = $self.find("input").attr('name');
            id = $self.find("input").attr("id");

            if(options.typeField == 'textarea'){
                field = "<textarea id='"+id+"' name='"+name+"' class='editingField'>"+value+"</textarea>";
            }else{
                field = "<input class='editingField' type='text' id='"+id+"' name='"+name+"' value='"+value+"'/>";
            }

            $self.addClass('open').html(field);
            $self.find(".editingField").focus().css(options.style);

            process = true;
        }

        $(this).on('blur', ".editingField", function(){
            if(process){
                $(this).remove();
                input = "<input type='hidden' id='"+id+"' name='"+name+"' />";
                $self.html(value + input);
                dblclick = true;
                process = false;
            }
        });

        $(this).on('change', ".editingField", function(){
            if(process){
                var value = $(this).val();
                var params = $(this).serialize();

                $(this).hide();
                input = "<input type='hidden' id='"+id+"' name='"+name+"' />";
                $self.html(value + input);

                if(action){
                    $.ajax({
                        url: action+'/'+id,
                        data: params,
                        type: 'post',
                        dataType: 'json',
                        success: function(data){
                            callback(data);
                        }
                    });
                }
                dblclick = true;
                process = false;
            }
        });
    });
};

gistfile1.js

$('.editable').editHere($('[name="actionEdit"]').val(), function(data){
    if(data.status == 'TRA_OK'){
        $('.widget-content').alert(data.success, 'alert-success');
    }else{
        $('.widget-content').alert(data.error || data.message, 'alert-error');
    }
}, {style: {width: '95%'}, typeField: 'textarea'});