diario rck: jquery

Mostrando entradas con la etiqueta jquery. Mostrar todas las entradas

viernes, 23 de octubre de 2015

jQuery: promesas

<html>
  <head>
    <title>test canvas</title>
    <script language="javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script> 

    <script language="javascript" type="text/javascript">
  $(document).ready(function(){
  
   // var obteniendoTweets = $.get('simple_json.php');
   var obteniendoTweets = $.get('simple_json.php');
   var obteniendoOtro = $.get('simple_json_retardo.php'); //tarde 3 seg
   
   // console.log(obteniendoTweets)
   // console.log(obteniendoTweets)
      
   obteniendoTweets.done(function(obj) {  
     // $.post(��anade_favoritos.php’, estacion);
     console.log("ya llegaron los Tweets",obj)
   });   
   
   obteniendoTweets.fail(function() {  
    //cuando falla
   });
   
   obteniendoTweets.always(function() {  
    //siempre
   });
   
   $.when(obteniendoTweets, obteniendoOtro).then(function(obj1, obj2) {
     // Ambas habrán tenido éxito
     console.log("llegaro TODO ambos");
     console.log(obj1[0], obj2[0])
   }, function() {
     // Alguna ha fallado
   }, function() {
     // Pase lo que pase, siempre vamos a quitar el elemento cargando
     //$(��#contenido’).remove(��.cargando’);
   });
   
  });
 </script> 

  </head>
  <body>
 
    <h1>test canvas</h1>
 
 </body>
</html>

miércoles, 17 de julio de 2013

jquery dataTable: filtrar solo cuando se presiona enter para no saturar el servidor de base de datos

modificar en jquery.dataTables.js por la linea 2071 (estoy en datatable 1.9.3)

jqFilter.bind( 'keyup.DT', function(e) {
  var val = this.value==="" ? "" : this.value; // mental IE8 fix :-(
  
  if(val.length != 0 && e.keyCode != 13) { return; } //rck 17/07/2013

con esto no mataremos tanto al servidor de base de datos.

saludos

jueves, 30 de mayo de 2013

jQuery: agregar jQuery Dinamicamente

<script type="text/javascript">
if (typeof jQuery == 'undefined') {
    var script = document.createElement('script');
    script.type = "text/javascript";
    script.src = "http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js";
    document.getElementsByTagName('head')[0].appendChild(script);
}
</script>

martes, 19 de marzo de 2013

Datatable: ordenar por Fecha

jQuery.fn.dataTableExt.oSort['fecha-asc']  = function(a,b) {
    var ukDatea = a.split('/');
    var ukDateb = b.split('/');

    var x = (ukDatea[2] + ukDatea[1] + ukDatea[0]) * 1;
    var y = (ukDateb[2] + ukDateb[1] + ukDateb[0]) * 1;

    return ((x < y) ? -1 : ((x > y) ?  1 : 0));
};

jQuery.fn.dataTableExt.oSort['fecha-desc'] = function(a,b) {
    var ukDatea = a.split('/');
    var ukDateb = b.split('/');

    var x = (ukDatea[2] + ukDatea[1] + ukDatea[0]) * 1;
    var y = (ukDateb[2] + ukDateb[1] + ukDateb[0]) * 1;

    return ((x < y) ? 1 : ((x > y) ?  -1 : 0));
};

en el datatable:

"sType": "fecha"

viernes, 9 de noviembre de 2012

jQuery: Test Time Entry

$(".entry_hora").timeEntry({
    ampmPrefix: ' ',
    spinnerImage: 'spinnerDefault.png'
});

Test Online.
http://jsfiddle.net/ric47121/9QkpK/

Web Oficial:
http://keith-wood.name/timeEntry.html

jueves, 25 de octubre de 2012

jQuery: input money con autoNumeric

$('#auto').autoNumeric({aSep: '.', aDec: ',', aSign: '$ '});

test online:

http://jsfiddle.net/ric47121/TUCCD/1/

documentacion:

http://www.decorplanit.com/plugin/

otros similares:

http://www.jquery4u.com/plugins/10-jquery-currencyprice-plugins/#.UIlcI8XA9Ip

jQuery: Test currency

$('#currencyField').blur(function(e) {
    
    $(this).formatCurrency();
   
});

test online:
http://jsfiddle.net/ric47121/MDkGZ/

martes, 18 de septiembre de 2012

jQuery: numberfield en todos los navegadores

HTML 5 numberfield funciona en chrome pero no asi en firefox.
solucion:

$('#spinner2').spinner({ min: 2, max: 5 });

test rck:

http://jsfiddle.net/ric47121/yKhFd/2/

jueves, 26 de julio de 2012

jQuery: mi primer Plugin 'resaltado de texto con jquery'

$.fn.resaltar= function(options){  

        var opts = $.extend({}, $.fn.resaltar.defaults, options);    
        
        this.each(function(){    
            
            //console.log(this);
            //$(this).css({'background':'rgba(255, 0, 0, .4)'});  //SI
                          
            (function(self){
               var t = 1; 
               var sube =true;
                                
              var timer = setInterval(function(){    
                     // console.log(self) 
                      
                    //$(self).css({'background':'rgba(255, 0, 0, .4)'});        //si
                          
                  //var color = 'rgba(255, 0, 0, .'+t+')'; //comun
                  var color = 'rgba('+opts.r+', '+opts.g+', '+opts.b+', .'+t+')'; 
                  
                  
                  
                 //$(this).css({'background': color}); // NO ANDA!!
                  $(self).css({'background': color}); //SIII
                    //console.log("asdsa", t, sube, color)
                        
                    if(sube) t++;
                       else t--;
                        
                    if(sube && t==9) sube = false;    
                  if(!sube && t==-1) clearInterval(timer)           
                   
                    
                },50);
                      
            })(this);
                  
                  
        });        
    };  
       
    $.fn.resaltar.defaults = {  
        // para el fondo un color por defecto  
        r: '255',
        g: '0',
        b  : '0'
    };  

/*----------------------------*/
//$("#test1").resaltar();  

$("#my").click(function(){
     $("#test1").resaltar();  
    $("#test2").resaltar({r:'0',g:'255',b:'0'});  
});

test rck:

http://jsfiddle.net/ric47121/sUnKf/6/

test Online:

http://ricardolevano.com.ar/test/test_resaltado_jquery_by_rck/test1.html

martes, 24 de julio de 2012

jQuery: Simple Loguer

function agregarEvento(){
    //var loguer = $("#loguer-rck");
    $("#loguer-rck").prepend("<li> <span>3:05 pm :</span>  un nuevo item.</li>");
    console.log("agregado")

     //   $("#loguer_conteiner").scrollTop(9999);
    $("#loguer_conteiner").animate({scrollTop:0}, 'slow');
}
        
test rck:

http://jsfiddle.net/ric47121/98efR/7/

test rck 2 (con resaltado by rck)

http://jsfiddle.net/ric47121/98efR/8/

lunes, 16 de julio de 2012

jQuery: filtrar tabla inline

var todos =[];

$("#table_defensorias tbody tr").each(function(index) {
       //todos.push($(this).text());
        //$(this).find("td").eq(0).css("color","red")
        //colum_1.push($(this).find("td").eq(0).text());
        todos.push({
            colum_0: $(this).find("td").eq(0).text(),
            colum_1: $(this).find("td").eq(1).text()
        }); 
    });

//console.log(todos) //ok

$("#filter_def").keyup(function(){
    //console.log($(this).val());
    
    $("#table_defensorias tbody").html("");
   var srtSearch = $(this).val(); 
   //var filtrados = filtrar(todos, srtSearch);
   
    //var filtrados = _.filter(todos, function(txt){ return /+'srtSearch '+/gi.test(txt); });
    
    var filtrados = _.filter(todos, function(obj){ 
        return (
            (new RegExp(srtSearch,'gi')).test(obj.colum_0) ||
            (new RegExp(srtSearch,'gi')).test(obj.colum_1)
)            
            ; });
    
    //console.log(filtrados)
        
    for(var i=0;i<filtrados.length;i++){
        $('#table_defensorias tbody')
        .append('<tr>'+
        '<td>'+filtrados[i].colum_0+'</td>'+
        '<td>'+filtrados[i].colum_1+'</td>'+
        '<td>'+'</td>'+
        '<td>'+'</td>'+
        '</tr>');
    }

});

test rck:

http://jsfiddle.net/ric47121/49s6W/3/

jQuery: filter ul usando underscore.js

var todos = [];

$("ul li").each(function(index) {
   todos.push($(this).text());
});

$("#filter_def").keyup(function(){
    
    $("ul").html("");
   var srtSearch = $(this).val(); 

    var filtrados = _.filter(todos, function(txt){ return (new RegExp(srtSearch,'gi')).test(txt); });
    
    for(var i=0;i<filtrados.length;i++){
        $('ul').append('<li>'+filtrados[i]+'</li>');
    }

});

test rck:

http://jsfiddle.net/ric47121/Cvq4e/4/

jueves, 12 de julio de 2012

jQuery: Autocomplete con resaltdo, tpl y subserach

$(function() {
            
                var projects = [
                    {
                        value: "jquery",
                        label: "jQuery",
                        desc: "the write less, do more, JavaScript library",
                        icon: "jquery_32x32.png"
                    },
                    {
                        value: "jquery-ui",
                        label: "jQuery UI",
                        desc: "the official user interface library for jQuery",
                        icon: "jqueryui_32x32.png"
                    },
                    {
                        value: "sizzlejs",
                        label: "Sizzle JS",
                        desc: "a pure-JavaScript CSS selector engine",
                        icon: "sizzlejs_32x32.png"
                    }
                ];

                function custom_source(request, response) {
                    var matcher = new RegExp($.ui.autocomplete.escapeRegex(request.term), "i");
                    response($.grep(projects, function(value) {
                        return matcher.test(value.label)
                            || matcher.test(value.desc);
                    }));
                }

                var auto = $( "#project" ).autocomplete({
                    minLength: 0,
                    source: custom_source, //projects o  "algo.php",
                    //                    search: "desc",
                    focus: function( event, ui ) {
                        $( "#project" ).val( ui.item.label );
                        return false;
                    },
                    select: function( event, ui ) {
                        $( "#project" ).val( ui.item.label );
                        $( "#project-id" ).val( ui.item.value );
                        $( "#project-description" ).html( ui.item.desc );
                        $( "#project-icon" ).attr( "src", "images/" + ui.item.icon );

                        return false;
                    }
                })
                .data( "autocomplete" )._renderItem = function( ul, item ) {                    
  //                  console.log(item);                    
//console.log($(this).val());
//console.log($("#project").val());

                    var mostrar = "<a>" + item.label + "<br>" + item.desc + "</a>";

                    if($("#project").val())
                        mostrar = __highlight(mostrar, $("#project").val());
                    
                    return $( "<li></li>" )
                    .data( "item.autocomplete", item )
                    .append( mostrar )
                    .appendTo( ul );
                };
                
//                console.info(auto);
                function __highlight(s, t) {
                  var matcher = new RegExp("("+$.ui.autocomplete.escapeRegex(t)+")", "ig" );
                  return s.replace(matcher, '<b style="color:blue">$1</b>');
                }

            });

Documentacion Oficial

http://jqueryui.com/demos/autocomplete/#custom-data

Test Online:

/jqueryui_autocomplete/tpl_ventana_test_for_iframe.html

jueves, 7 de junio de 2012

jQuery: textbox disabled y enviado por POST

HTML

<select name="docTipo" id="solapaDatosPersonales_docTipo" class="columna2" onchange="cambioTipoDoc(this)">
 <option value="1">DNI</option>
 <option value="2">NO INFORMADO</option>    
</select>

<br/>
<input type="text" name="docNro" id="solapaDatosPersonales_docNro" class="columna4" value="asd"/>

function cambioTipoDoc(control){
    console.log(control.value)
    if(control.value == 2){ //no informado
        //$("#solapaDatosPersonales_docNro").attr("disabled", "disabled");
        $("#solapaDatosPersonales_docNro").attr("readonly", "readonly");
        $("#solapaDatosPersonales_docNro").css("background", "#f0f0f0");
    }
    else{
        $("#solapaDatosPersonales_docNro").removeAttr("readonly");
         $("#solapaDatosPersonales_docNro").css("background", "#fff");
    }
}

Test rck:

http://jsfiddle.net/ric47121/nDhLe/

lunes, 21 de mayo de 2012

jQuery: DataTables test edicion dinamica

var giCount = 1;
var  oTable;

$(document).ready(function() {
    oTable = $('#example').dataTable({
        "aaData": [
            [ "Webkit", "Safari 2.0", "OSX.4+", 419.3, "A" ],
            [ "Webkit", "Safari 3.0", "OSX.4+", 522.1, "A" ]
        ]
    
    });
  
 console.log(oTable);
} );
 
function fnClickAddRow() {
    oTable.fnAddData( [
        giCount+".1",
        giCount+".2",
        giCount+".3",
        giCount+".4",
        giCount+".5" ] );
     
    giCount++;
}


 function redibujarTabla(){
   var arrDatos = [
               [ "Trident", "Internet Explorer 6.0", "Win 98+", 6, "A" ],
            [ "Trident", "Internet Explorer 7.0", "Win XP SP2+", 7, "A" ]
        ];
   
   console.log(arrDatos);
   oTable.fnClearTable();   
   
   
   for(var i=0;i<arrDatos.length;i++){
      console.log(arrDatos[i]);
     oTable.fnAddData(arrDatos[i]);
   }     
  
 }  


function vaciarTabla(){
     oTable.fnClearTable();   
  }

function cambiarDatos(){
     oTable.fnUpdate( ['a', 'b', 'c', 'd', 'e'], 1, 0 ); // Row
   
  }

function recargarDatos(){
   // fnReloadAjax()
 }

Test Online:

http://live.datatables.net/ikoxog/6/edit

miércoles, 9 de mayo de 2012

jQuery: para Pablon de dgn con cariño - detectar cambio en select con jQuery

    
    $("#miSelect").change(function(){
        //console.log($(this));        
        if($(this).val() == "volvo"){
            $("#miInput").show()       
        }           
    })

Test Online:

http://jsfiddle.net/t5TMQ/

jueves, 22 de marzo de 2012

jQuery: comprobar si el formulario esta vacio

function comprobarSiFormEstaVacio(aFormId) {

        var campos = $("#"+aFormId).serializeArray();
        var todos_vacios = true;
        
        for(var i=0; i<campos.length; i++){
            // console.log(campos[i].name); console.info(campos[i].value);
            if($.trim(campos[i].value) != "" ) todos_vacios = false;
        }        
    
        if (todos_vacios){
            alert("Debe ingresar al menos un criterio de búsqueda");
            return false;
        }

        return true;        
    }

jQuery: comprobar campos text en un form

//veo si estan todos vacios
        var todos_vacios = true;
        $("#frmBusquedaInstitucion input[type='text']").map(function(val, i){
            console.log($(this).val());
            if($(this).val() != "" ) todos_vacios = false;            
        });

miércoles, 3 de agosto de 2011

jquery: levantar template con jquery

$.ajax({
            url: "../templates/hotel.htm",
            cache: false,
            success: function(html) {
                    //$(".listado_hoteles").append(html);

                    var imprimir = "";
                    for (var i = 1; i <= 4; i++) {
                        imprimir = html.replace("@@NRO@@", i);

                        $(".listado_hoteles").append(imprimir);
                    }            
            }

viernes, 15 de octubre de 2010

jQuery: Haciendo un Plugging en jQuery

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"   
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr"><head>  
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />  
  <title>Highlight jQuery plugin</title>  
  
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script> 
  
  <script type="text/javascript">
    // definición de la función  
    $.fn.highlight = function(options){  
        // puede recibir un array de parámetros nombrados  
        // invocamos a una función genérica que hace el merge   
        // entre los recibidos y los de por defecto   
        var opts = $.extend({}, $.fn.highlight.defaults, options);  
      
        // para cada componente que puede contener el objeto jQuery que invoca a esta función  
        this.each(function(){  
            // asignamos a la asignación del foco la invocación a una función  
            $(this).focus(function(){  
                // que asigna al fondo el color recibido o el asginado por defecto  
                $(this).css({"background" : opts.background});  
            });  
            // asignamos a la perdida del foco la invocación a una función  
            $(this).blur(function(){  
                // que asigna al fondo un color blanco  
                $(this).css({"background" : "white"});  
            });  
        });  
      
    };  
      
    // definimos los parámetros junto con los valores por defecto de la función  
    $.fn.highlight.defaults = {  
        // para el fondo un color por defecto  
        background: '#a6cdec'  
    };  
  </script>  
  
  <script type="text/javascript">
    $(document).ready(function(){    
 
        //$("form :input:visible").highlight(); 

        $("form :input:visible").highlight({background: 'red'});  
      
    });  
  </script>  
  
</head>  
<body>  
<h1>Highlight jQuery plugin</h1>  
<form method="post" action="" name="test1">  
  <table>  
    <tbody>  
      <tr>  
        <td> <label for="name">Name</label> </td>  
        <td> <input id="name" type="text" /> </td>  
      </tr>  
      <tr>  
        <td> <label for="country">Country</label> </td>  
        <td> <input id="country" type="text" /> </td>  
      </tr>  
      <tr>  
        <td> <label for="password">Password</label> </td>  
        <td> <input id="password" type="password" /> </td>  
      </tr>  
    </tbody>  
  </table>  
</form>  
<br />  
<small>Mueve el foco entre los campos del formulario</small>  
</body>  
</html>

test rck:

http://jsfiddle.net/ric47121/rAbRG/

viernes, 23 de octubre de 2015

miércoles, 17 de julio de 2013

jueves, 30 de mayo de 2013

martes, 19 de marzo de 2013

viernes, 9 de noviembre de 2012

jueves, 25 de octubre de 2012

martes, 18 de septiembre de 2012

jueves, 26 de julio de 2012

martes, 24 de julio de 2012

lunes, 16 de julio de 2012

jueves, 12 de julio de 2012

jueves, 7 de junio de 2012

lunes, 21 de mayo de 2012

miércoles, 9 de mayo de 2012

jueves, 22 de marzo de 2012

miércoles, 3 de agosto de 2011

viernes, 15 de octubre de 2010

Datos personales

Archivo del blog

Seguidores