sgi/js/datalist_orig.js

/* 
 * Selects con datalist
 */
var click_in_process = false;
/*$('.datalist-text ul li').mousedown(function() {
    click_in_process = true;
});
$('.datalist-text ul li').mouseup(function() {
    click_in_process = false;
    var elementRoot = $(this).parents('.datalist');
    elementRoot.find('.datalist-input').focus();
});*/

$('.datalist-text .datalist-input').on('focusin', function(){
    var elementRoot = $(this).parents('.datalist');
    elementRoot.find(".icono").show();
    elementRoot.find("ul").show();
    elementRoot.find(".datalist-input").trigger("keyup");
});

//$('.datalist-input').click(function(){
$(document).on('click', '.datalist-input',function(){
    var elementRoot = $(this).parent();
    limpiaInput({"data":{"padre":elementRoot}});
    
    if(!elementRoot.hasClass("disabled")){
        elementRoot.find('ul').show();
        elementRoot.find('.datalist-input').focus();
        elementRoot.find('ul').show();
        elementRoot.find('.icono').removeClass('ing-buscar').addClass('ing-cancelar iconoAzul pointer');
        elementRoot.find('.icono').on('click',{"padre":elementRoot}, limpiaInput);
        elementRoot.find('.icono').on('click',{"padre":elementRoot},ocultaList);
    }
});


function ocultaList(e){
    (e.data.padre).find('.icono').removeClass('ing-cancelar iconoAzul pointer').addClass('ing-buscar');
    (e.data.padre).find('ul').hide();
    /*$('.datalist .icono').removeClass('ing-cancelar iconoAzul pointer').addClass('ing-buscar');
    $('.datalist ul').hide();*/
}

//usar class="selected" para marcar seleccioando por default
$(function() {
    $.each($(".datalist").find('ul li:not(.not-selectable)'), function(){
        if($(this).hasClass("selected")){
            var elementRoot = $(this).parents('.datalist');
            elementRoot.find('.datalist-input').text($(this).html().replace(/[\t\n]+/g,' ').trim());
            var cid = $(this).data('id');
            elementRoot.find("input[type=hidden]").val(cid);
        }
    });
});

$(document).on('click', '.datalist-select > ul li:not(.not-selectable)' ,function(){
    var elementRoot = $(this).parents('.datalist');
    elementRoot.find('.datalist-input').text($(this).html().replace(/[\t\n]+/g,' ').trim());
    //$(this).parent('ul').siblings('input[type="text"]').blur();
    ocultaList({"data":{"padre":elementRoot}});
    var cid = $(this).data('id');
    elementRoot.find("input[type=hidden]").val(cid);
    elementRoot.find("li").removeClass("selected");
    $(this).addClass("selected");
    elementRoot.removeClass("datalist-invalid");
});


$('.modal').on('hide.bs.modal', function (e) {
    $('.datalist .icono').removeClass('ing-cancelar iconoAzul pointer').addClass('ing-buscar');
    $('.datalist ul').hide();
});

function setDatalist(selector, value=-1){
    var elementRoot = $(selector).parents('.datalist');
    $.each(elementRoot.find('ul li:not(.not-selectable)'), function(){
        if($(this).data("id") == value){
            elementRoot.find('.datalist-input').text($(this).html().replace(/[\t\n]+/g,' ').trim());
            $(selector).val(value);
            elementRoot.find("li").removeClass("selected");
            $(this).addClass("selected");
        }
    });
}

function setDatalistFirst(selector){
    var index=1;
    var elementRoot = $(selector).parents('.datalist');
    var num = elementRoot.find('ul li:not(.not-selectable)').length;
    if(index <= num){
        while(elementRoot.find('ul li:nth-child('+index+')').hasClass("not-selectable") && index <= num){
            index++;
        }
        var element = elementRoot.find('ul li:nth-child('+index+')');
        elementRoot.find('.datalist-input').text(element.html().replace(/[\t\n]+/g,' ').trim());
        $(selector).val(element.data("id"));
        elementRoot.find("li").removeClass("selected");
        element.addClass("selected");
    }
}

function disableDatalist(selector, disabled=true){
    var elementRoot = $(selector).parents('.datalist');
    if(disabled){
        elementRoot.addClass("disabled");
        ocultaList({"data":{"padre":elementRoot}});
    }else
        elementRoot.removeClass("disabled");
}

function invalidDatalist(selector, invalid=true){
    var elementRoot = $(selector).parents('.datalist');
    if(invalid){
        elementRoot.addClass("datalist-invalid");
    }else
        elementRoot.removeClass("datalist-invalid");
}

function buscaDatalist(selector, valor){
    selector.find('ul li').each(function(){
        var elem = $(this);
        if ($(this).parent().is('li'))
            elem = $(this).parent();
        if (!$(this).html().toUpperCase().includes(valor.toUpperCase())){
            $(elem).hide();
            selector.find('.datalist-input').val("");
            selector.find("input[type=hidden]").val("");
        }else
            $(elem).show();
    });
}
function getDatalistText(selector, valor){
    var elementRoot = $(selector).parents('.datalist');
    var text ="";
    $.each(elementRoot.find('ul li:not(.not-selectable)'), function(){
        if($(this).data("id") == valor){
            text = $(this).html();
        }
    });
    return text;
}
//---
$('.datalist-text .datalist-input').keyup(function(){
    var elementRoot = $(this).parents('.datalist');
    var input = $(this);
    elementRoot.find('ul li').each(function(){
        var elem = $(this);
        if ($(this).parent().is('li'))
            elem = $(this).parent();
        if (!$(this).html().toUpperCase().includes(input.val().toUpperCase()))
            $(elem).hide();
        else
            $(elem).show();
    });
});

/*
$('.datalist-text input').blur(function() {
    var elementRoot = $(this).parents('.datalist');
    console.log("Click? "+click_in_process);
    if(!click_in_process) {
        buscaDatalist(elementRoot, elementRoot.find('.datalist-input').val());
        
        elementRoot.find('.icono').removeClass('ing-cancelar iconoAzul pointer').addClass('ing-buscar');
        elementRoot.find('ul').children('li').show();
        elementRoot.find('ul').hide();
    }
    click_in_process = false;
});
*/

$('.datalist-text > ul li:not(.not-selectable)').click(function(){
    console.log("Li click!"+$(this).html());
    var elementRoot = $(this).parents('.datalist');
    elementRoot.find('.datalist-input').val($(this).html().replace(/[\t\n]+/g,' ').trim());
    
    //$(this).parent('ul').siblings('input[type="text"]').blur();
    
    var cid = $(this).data('id');
    elementRoot.find("input[type=hidden]").val(cid);
    elementRoot.find("li").removeClass("selected");
    $(this).addClass("selected");
    click_in_process = true;
    //elementRoot.find('.datalist-input').blur();
    ocultaList({"data":{"padre":elementRoot}});
});

$('.datalist-text .datalist-input').click(function(){
    var elementRoot = $(this).parents('.datalist');
    limpiaInput({"data":{"padre":elementRoot}});
    elementRoot.find('ul').show();
    elementRoot.find('input').focus();
    elementRoot.find('ul').show();
    elementRoot.find('.icono').removeClass('ing-buscar').addClass('ing-cancelar iconoAzul pointer');
    elementRoot.find('.icono').on('click',{"padre":elementRoot}, limpiaInput);
});


function limpiaInput(e) {
    (e.data.padre).find('.datalist-input').val('');
    (e.data.padre).find('.datalist-input').parent().children('ul').children('li').show();
    (e.data.padre).find('li:first').focus();
    (e.data.padre).find('.datalist-input').focus();
    
}