Category Archives: javascript

Ordenar columnas datatable jquery

Hay determinadas columnas que no se ordenan bien de manera nativa utilizando jquery.datatable.js
Por ejemplo las fechas

Las fechas en español no se ordenan bien, para ello tenemos que indicarle un valor con la fecha en formato americano de manera que no se vea pero que le sirva para ordenar:

Donde lo importante es poner un elemento <span style=”display:none”>valor util para ordenar</span> que en el caso de las fechas es con el formato americano.

 

Usar verify.js para validar un formulario usando AJAX

El plugin verify.js nos permite validar un formulario rápidamente, pero funciona cuando se envía el formulario con el botón submit.

Si el formulario lo queremos utilizar mediante ajax no se dispara el evento.

campoobligatorio

Para ellos vamos a utilizar el evento beforeSubmit

<form id="formulario1" action="destiny.php" method="POST" name="formulario1">
<input id="field" class="form-control" name="field" type="text" value="" placeholder="" data-validate="required" /> 
<input type="submit" onclick="function_validate_form()"/>
</form>
<script>
function function_validate_form(){
    $('#formulario1').verify({
    'beforeSubmit': function(form, result) {
    if (result) {
        // Since the form is valid, submit form via AJAX.
      alert('OK, send ajax');
      send_ajax();
    }else{
        //do nothing
    }

    // Form is either invalid or was already submitted, return `false` to tell verify.js to not submit the form.
    return false; 
}
});
}
function send_ajax(){
var formData = $("#formulario1").serializeArray(); 
var URL = $("#formulario1").attr("action"); 
$.post(URL, formData, function(data) { console.log(data); },"json") .fail(function(jqXHR, textStatus, errorThrown) { alert( "error ajax" ); });
}
</script>
<script src="plugins/jQuery/jQuery-2.1.4.min.js"></script>
<script src="plugins/jQueryUI/jquery-ui.min.js"></script>
<script src="plugins/verify.notify.min.js"></script>

Detectar tecla mayusculas pulsada al hacer click en un enlace

Si queremos que al pulsar en un elemento se comporte de manera distinta si tiene la tacla mayusculas pulsada lo podemos conseguir con Javascript:

<html>
<head>

<script>
var may;
function estaPulsadoShift(event){
if (event.shiftKey==1)
    may=true;
else
   may=false;
}
function prueba(){
	if (may){
		window.location="https://www.google.es/?gws_rd=ssl#q=pulsado";
	}else{
		window.location="https://www.google.es/?gws_rd=ssl#q=no+pulsado";
		
	}
	
}
</script>
</head>
<body onmousedown="estaPulsadoShift(event);">
	Si quieres que se comporte distinto manten pulsado "Mayusculas"
	<input type="button" onclick="prueba()" value="Pulsame">

</body>
</html>

Ejemplo funcinando https://jsfiddle.net/Lu252r5z/