ORIDOKI

Función JavaScript para validar el número de telefono.

function isValidPhoneNumber(ph) {
	if (ph == null) {
		return false;
	}
	var stripped = ph.replace(/[\s()+-]|ext\.?/gi, "");
	return ((/\d{10,}/i).test(stripped));
}

Función JavaScript para validar email.

function isValidEmailAddress(emailAddress) {
	var pattern = new RegExp(/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i);
	return pattern.test(emailAddress);
}

Buenas,

después de mucho buscar, y no encontrar nada de nada, al final, desarrollé este código que inserta en la pagina un datepicker de JQueryUI, y lo rellena con datos servidos en JSON. Igual es una chorrada, pero no he encontrado nada mejor, así que aquí os lo dejo por si queréis echarle un vistazo.

Necesitaremos el siguiente script:

	$(function() {
		$("#datepicker").datepicker({
			numberOfMonths	: 3,
			monthNames			: ['Gener','Febrer','Març','Abril','Maig','Juny','Juliol','Agost','Setembre','Octubre','Novembre','Desembre'],
			dayNamesMin			: ['Diu', 'Dill', 'Dim', 'Dim', 'Dij', 'Div', 'Dis'],
			firstDay				: 1,
			currentText			: 'Avui',
			onChangeMonthYear: function(year, month, inst) {
				setTimeout("populateDays("+year+", "+month+")", 500);
			}
		});

	});

	function populateDays(year, month) {
		var months = $("#datepicker .ui-datepicker-group");

		for(var i=0; i
A continuación colocamos el objeto html en el lugar que nos interese:




Y por último necesitaremos un script de parte del servidor que pasandole los paramentros año y mes nos devuelva un array como el siguiente, con los dias en que el calendario contiene algún evento.

Para no aburriros os pongo directamente el tipo de código de salida, y ya os apañais  
echo "{'year': 2009, 'month' : 10, 'days' : [3,4,10,11,12,22,23,24,25,26]}";

El resultado es algo parecido a esto:

Autocompletar Datepicker en Jquery

Si tenéis alguna duda ya sabéis  
				

Ahora mismo estoy desarrollando una aplicación para un hotel en la que el usuario tiene que seleccionar dos fechas, y hay que calcular la diferencia entre las dos para obtener el número de noches que se va a alojar.

Solo tenéis que utilizar esta función javascript, que os devolverá un entero con el numero de noches.

function getNumeroDeNits(){
	var d1 = $('#datepicker1').val().split("-");
	var dat1 = new Date(d1[2], parseFloat(d1[1])-1, parseFloat(d1[0]));
	var d2 = $('#datepicker2').val().split("-");
	var dat2 = new Date(d2[2], parseFloat(d2[1])-1, parseFloat(d2[0]));

	var fin = dat2.getTime() - dat1.getTime();
	var dias = Math.floor(fin / (1000 * 60 * 60 * 24))  

	return dias;
}

Esta claro que en html deberíais tener dos campos llamados datepicker1 y datepicker2, con el formato de fecha dd-mm-aaaa.

Bueno después de un tiempo sin publicar a ver si nos ponemos las pilas de nuevo .

Cuando desarrollas webs de una sola pagina en las que muestras un contenido u otro en javascript, a menudo queda un poco tosca la transición entre un contenido y otro, lo mejor es hacer un scroll hasta arriba de la pagina y no hay manera más estética de hacerlo que mediante este trozo de código en jquery.

$('html, body').animate({scrollTop:0}, 'slow')

Espero que os guste y os sirva.

A continuación se muestra como extender el núcleo de JQuery para poder hacer uso de la función reset() de un formulario en JQuery

	$.fn.extend({
		reset: function() {
	   	return this.each(function() {
				$(this).is('form') && this.reset();
	   	});
		}
	});

Bueno como no podia ser de otra manera, Firefox, IE y Opera se lo montan diferente a la hora de gestionar los bookmarks, por lo que será necesario la siguiente función para poder crear un enlace que nos permita añadir un bookmark en cualquiera de los tres navegadores anteriores.

function CreateBookmarkLink(title, url) {
	if (window.sidebar) { // Mozilla Firefox Bookmark
		window.sidebar.addPanel(title, url,"");
	} else if( window.external ) { // IE Favorite
		window.external.AddFavorite( url, title); }
	else if(window.opera && window.print) { // Opera Hotlist
		return true; }
 }

Quizá soy yo no he sido capaz de encontrar la solución correcta pero me parece que una cosa tan simple como tener una opción seleccionada por defecto en un desplegable, no debería ser una tarea tan y tan complicada.

Aquí tenéis el código para poder tener una opción seleccionada por defecto en un desplegable con EXTJS

{
	xtype		: 'combo',
        fieldLabel	        : 'Sexo',

	hiddenName	: 'sexo',
        name		: 'sexo',

	mode		: 'local',
        width		: 250,
	displayField     : 'name',
	valueField	        : 'id',
	store                : new Ext.data.SimpleStore({
	        id		: 0 ,
	        fields	: [  'id', 'name' ],
	        data	: [
			    [1, 'Hombre'],
			    [2, 'Mujer']
			]
	    }),
	listeners	: {
		beforerender: function(combo){
			combo.setValue(1);// El ID de la opción por defecto
		}
	},
},

Si bien es cierto que podemos ponerle un valor por defecto con la propiedad value, Nos pone como valor el nombre es decir ‘Hombre’ o ‘Mujer’ y no el ID ‘1′ o ‘2′.

Lo ‘único‘ que hay que hacer entonces es utilizar la propiedad ‘hiddenName‘ y poner en el listener ‘beforerender‘, que se ejecuta una vez se ha cargado el store, una función que nos cargue como valor el ID que queramos.
Me ha costado encontrar como hacerlo, espero que no perdáis tanto rato como yo, si tenéis dudas preguntad

Es sencillo crear un desplegable con extJS, siempre y cuando tengas claro como, hoy vamos a ver un ejemplo muy básico de como hacerlo.

Primero tenemos que crear una variable que contenga el array representativo del del contenido del desplegable.

	var misDatos = [
     [1, 'item1'],
     [2, 'item2']
	];

A continuación creamos el desplegable, y le asignamos esta variable mediante la propiedad store.

	var combo = new Ext.form.ComboBox({
    store: new Ext.data.SimpleStore({
         id:0
        ,fields:
            [
                'myId',   //numeric value is the key
                'myText' //the text value is the value
            ]
        ,data: misDatos
    })
    ,valueField:'myId'
    ,displayField:'myText'
    ,mode:'local'
    // rest of config
});

Aparentemente eso es todo, otro día veremos ejemplos más elaborados.

Aqui podéis encontrar varios ejemplos que os pueden ayudar a comprender mejor el elemento ComboBox.

Javascript tiene una limitación por la que no se permite hacer llamadas AJAX entre dos dominios distintos. Como todas las limitaciones se ha superado de una forma u otra.

Hoy vamos a ver como superar esta limitación mediante un proxy PHP, y en los siguientes días veremos como hacerlo con CSSHTTPrequest y con JSONP.

Bien, vamos al trapo. Para empezar tenemos que desarrollar un proxy en PHP que haga las peticiones entre dominios en el lugar de Javascript, de este modo podemos llamar desde Javascript a nuestro script ‘proxy.php’ sin salir del dominio actual.

	define ('HOSTNAME', 'http://www.dominiodestino.com/');
	$path = ($_POST['path']) ? $_POST['path'] : $_GET['path'];
	$url = HOSTNAME.$path;
	$session = curl_init($url);

	if ($_POST['path'])
		{
		$postvars = '';
		while (list($clau, $valor) = each($_POST))
			{
			$postvars .= $clau.'='.$valor.'&';
			}
		curl_setopt ($session, CURLOPT_POST, true);
		curl_setopt ($session, CURLOPT_POSTFIELDS, $postvars);
		}
	curl_setopt($session, CURLOPT_HEADER, false);
	curl_setopt($session, CURLOPT_RETURNTRANSFER, true);

	$xml = curl_exec($session);
	header ("content-type: text/xml");

	echo $xml;
	curl_close($session);

Podemos hacer peticiones AJAX a este script como si se las hiciéramos al dominio de destino, simplemente teniendo en cuenta que debemos pasar la variable path con el path del dominio de destino.

En prototype la petición sería:

	new Ajax.Request("proxy.php", {
	  method: 'post',
	  parameters: "&path=index.php&text=hola",
	  onSuccess: function(transport){
	  	alert(transport.responseText);
	  }
	});