/* * 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(); }