jquery.mutable.js
1.66 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
(function ( $ ) {
    $.fn.mutarSelect = function( options ){
        // This is the easiest way to have default options.
        var settings = $.extend({
        valueselector:"Agregar nuevo",
        }, options );
        var father = $(this).attr("id");
        $(this).append("<option value='' class='mutarselect-add'>" + settings.valueselector + "</option>");
    
        $("#" + father + " .mutarselect-add").click(function( event ){
                event.preventDefault();
                $("#" + father + " .mutarselect-rm" ).remove();
                $(this).parent("#" + father).hide();
                               
                $("<input type='text' placeholder='nuevo valor' autofocus autocomplete=off' class='mutarselect-input " + father +"' >").insertAfter( $(this).parent(".mutarselect") );
        });    
           
        $("form").on("keypress", ".mutarselect-input",function( event ){
            if ( event.keyCode == '13' ){
                event.preventDefault();
                $(this).prev(".mutarselect").prepend("<option selected=\"selected\" value='" + $(this).val()  + "' class='mutarselect-rm'>" + $(this).val() + "</option>");
                $(this).prev(".mutarselect").show();
                $(this).remove();
                
            }
        });
      $("form").on("focusout", ".mutarselect-input",function( event ){
                $(this).prev(".mutarselect").prepend("<option selected=\"selected\" value='" + $(this).val()  + "' class='mutarselect-rm'>" + $(this).val() + "</option>");
                $(this).prev(".mutarselect").show();
                $(this).remove();
        });
        //return this;
    };
}( jQuery ));