Actualité http://www.reversoform.com/blog Un blog utilisant WordPress Mon, 06 Sep 2010 13:55:59 +0000 http://wordpress.org/?v=2.6.3 en Intégration simple http://www.reversoform.com/blog/?p=461 http://www.reversoform.com/blog/?p=461#comments Thu, 12 Mar 2009 14:19:06 +0000 admin http://www.reversoform.com/blog/?p=461 Ce simple champs permet à l’internaute d’identifier l’outil qui le débarrasse de la corvée  du formulaire.

Sinon, il remplit manuellement les champs, comme avant.

.
Formulaire Express
Téléphone fixe *

Formulae vulgaris
Nom *
Prénom *
Adresse *
Code Postal / Ville *
Pays
Société
NAF / Siref
powered by reversoform.com
 
<div style="width:250px;font-family:Verdana, Arial, Helvetica, sans-serif;position:relative;"><br />
<div style="color:#ffffff;background:url(http://reversoform.com/art/baguette2.gif) no-repeat 10px 0;position:absolute;left:-2px;top:-27px;height:70px;width:90px;z-index:1;"> </div><br />
<input id="telephone" style="width:250px;background:#FFFFFF;border:1px solid #F28D45;font-size:14px;color:#777777;position:absolute;top:inherit;left:inherit;z-index:10;font-family:Verdana, Arial, Helvetica, sans-serif;font-size:13px;height:17px;padding:2px 5px 3px;" onclick="clickHandeler( this );" onkeyup="actionKeyAuto( this );" value="mon téléphone fixe" /><div style="color:#F28D45;font-size:11px;font-weight:normal;position:absolute;top:-15px;right:-10px;">Formulaire Xpress</div><div style="position:absolute;top:4px;right:-7px;z-index:11;" onmouseover="actionOver();" onmouseout="actionOut();"><a href="http://www.reversoform.com/cnil" target="_blank"><img src="http://www.reversoform.com/img/interogation.png" alt="" /></a></div>
<div id="revPop" style="border: 1px solid #ff6600; padding: 3px 5px; background: #ffffff none repeat scroll 0% 0%; display: none; width: 200px; position: absolute; top: -40px; right: -15pt; z-index: 15;">Vos coordonées proviennent de l'annuaire téléphonique.</div>

Puis en bas de page, ou après votre formulaire HTML copier le code javascript suivant :


<script type="text/javascript">
		var RevDate = new Date();
		document.write( unescape( "%3Cscript src='" + (("https:" == document.location.protocol) ? "https://api2.reversoform.com/includes/js/reversoObj.js" : "http://api2.reversoform.com/includes/js/reversoObj.js") + "?t="+RevDate.getTime()+"' type='text/javascript'%3E%3C/script%3E" ) );
    </script>
   	<script type="text/javascript" language="javascript">
    //<![CDATA[
	  	var ObjReverso = new ClassReverso();
		ObjReverso.serial		= '4403981856926'; 	// remplacer "4403981856926" par votre N° de série généré sur le site http://www.reversoform.com/api
		ObjReverso.phone		= 'telephone';
		ObjReverso.company		= 'company';
		ObjReverso.firstname	= 'first_name';
		ObjReverso.lastname		= 'last_name';
		ObjReverso.address		= 'address';
		ObjReverso.zip			= 'zip';
		ObjReverso.city			= 'city';
		ObjReverso.naf			= 'naf';
		ObjReverso.siret		= 'siret';

		ObjReverso.fireCallback = function( response )
		{
			if ( $( ObjReverso.phone ) )
			{
				if ( response=="NULL")
				{
					alert('correspondance non trouvée uv.');
				}
				else
				{
					/*
					alert( 	'prénom: \t\t'+ 	response.first_name +'\n'+
							'nom: \t\t'+  		response.last_name 	+'\n'+
							'adresse: \t\t'+	response.address 	+'\n'+
							'ville: \t\t'+ 		response.city 		+'\n'+
							'code postal: \t'+	response.zip 		+'\n'+
							'\n'+
							'société: \t\t'+	response.company	+'\n'+
							'code NAF: \t'+		response.naf		+'\n'+
							'siret: \t\t'+		response.siret
					);
					*/
                                }
			}
		};

		function actionOut()
		{
			document.getElementById('revPop').style.display = 'none';
		}

		function actionOver()
		{
			document.getElementById('revPop').style.display = 'block';
		}

		function actionKeyAuto( this_ )
		{
			if ( this_.value=='' )
			{
				this_.value = 'mon téléphone fixe';
				this_.focus();
				this_.select();
			}
			else
			{
				if ( this_.value.length>=10 &amp;amp;amp;&amp;amp;amp; this_.value!='mon téléphone fixe' )
				{
					ObjReverso.reverso( this_.value);
				}
			}
		}

		function clickHandeler( this_ )
		{
			if ( this_.value=='mon téléphone fixe' )
			{
				this_.focus();
				this_.select();
			}
		};

function doReverso( obj )
		{
			var phone = obj.value.replace(/[^0-9]/gi,"");

			if ( phone.length>=10 )
			{
				ObjReverso.reverso( phone );
			}
		}

try{document.getElementById( ObjReverso.phone ).onblur = function()
			{
				ObjReverso.reverso( this.value );
			};}catch(e){}
//]]>
</script>
]]> http://www.reversoform.com/blog/?feed=rss2&p=461 Intégration simple http://www.reversoform.com/blog/?p=449 http://www.reversoform.com/blog/?p=449#comments Thu, 12 Mar 2009 12:28:19 +0000 admin http://www.reversoform.com/blog/?p=449 Il vous suffit de placer ce champs au dessus de votre formulaire existant. L’internaute décide ou non d’y faire appel.

Dans le premier cas, il bénéficie du remplissage express et il peut identifier l’outil qui lui procure cet avantage.

Sinon, il remplit manuellement les champs, comme avant.

.
avec l’annuaire | comment ?
Préremplir
Téléphone fixe *

Formulae vulgaris
Nom *
Prénom *
Adresse *
Code Postal / Ville *
Pays
Société
NAF / Siref
powered by reversoform.com
 

<div style="width:250px;font-family:Verdana, Arial, Helvetica, sans-serif;position:relative;">
<div style="color:#ffffff;background:url(http://reversoform.com/art/baguette2.gif) no-repeat 10px 0;position:absolute;left:-2px;top:-27px;height:70px;width:90px;z-index:1;">.</div>
<input style="width:250px;background:#FFFFFF;border:1px solid #F28D45;font-size:14px;color:#777777;position:absolute;top:inherit;left:inherit;z-index:10;font-family:Verdana, Arial, Helvetica, sans-serif;font-size:13px;height:17px;padding:2px 5px 3px;font-weight:normal;" value="mon téléphone fixe" onkeyup="actionKey( this );" onclick="clickHandeler( this );" id="telephone"/>
<div style="color:#F28D45;font-size:11px;font-weight:normal;position:absolute;top:27px;right:-10px;text-decoration:underline;cursor:pointer;">avec l"annuaire | <a target="_blank" href="http://reversoform.com/cnil" style="text-decoration: underline; font-weight: normal; font-size: 12px;" class="orange">comment ?</a></div>
<div align="center" onclick="handleReverso();" style="background:transparent url(http://reversoform.com/img/bt/btform.png) no-repeat scroll 0 0;color:#FFFFFF;cursor:pointer;font-size:12px;font-weight:bold;height:24px;line-height:24px;position:absolute;right:-12px;top:0;width:111px;z-index:11;">Préremplir</div>
</div>

Puis en fin de page, ou quelquepart après le formulaire HTM, placer le code javascript suivant :


<script language="javascript" type="text/javascript">
// <![CDATA[
var ObjReverso = new ClassReverso();
ObjReverso.serial		= '4403981856926'; 	// remplacer "4403981856926" par votre N° de série généré sur le site http://www.reversoform.com/api
ObjReverso.phone		= 'telephone';
ObjReverso.company		= 'company';
ObjReverso.firstname	= 'first_name';
ObjReverso.lastname		= 'last_name';
ObjReverso.address		= 'address';
ObjReverso.zip			= 'zip';
ObjReverso.city			= 'city';
ObjReverso.naf			= 'naf';
ObjReverso.siret		= 'siret';

ObjReverso.fireCallback = function( response )
{
if ( response=="NULL")
{
alert('ce numéro n\'est pas attribué.');
}
else
{
/*
alert( 	'prénom: \t\t'+ 	response.first_name +'\n'+
'nom: \t\t'+  		response.last_name 	+'\n'+
'adresse: \t\t'+	response.address 	+'\n'+
'ville: \t\t'+ 		response.city 		+'\n'+
'code postal: \t'+	response.zip 		+'\n'+
'\n'+
'société: \t\t'+	response.company	+'\n'+
'code NAF: \t'+		response.naf		+'\n'+
'siret: \t\t'+		response.siret
);
*/
}
}

function handleReverso()
{
if ( document.getElementById( ObjReverso.phone ).value!='mon téléphone fixe' )
{
ObjReverso.reverso( document.getElementById( ObjReverso.phone ).value);
}
}

function actionOut()
{
document.getElementById('revPop').style.display = 'none';
}

function actionOver()
{
document.getElementById('revPop').style.display = 'block';
}

function actionKey( this_, e )
{
if ( this_.value=='' )
{
this_.value = 'mon téléphone fixe';
this_.focus();
this_.select();
}
if ( e )
			{
				if ( e.keyCode==13 )
				{
					validate();
				}
			}
			else if ( event )
			{
				if ( event.keyCode==13 )
				{
					validate();
				}
			}
}

function clickHandeler( this_ )
{
if ( this_.value=='mon téléphone fixe' )
{
this_.focus();
this_.select();
}
}
// ]]>
</script>
]]> http://www.reversoform.com/blog/?feed=rss2&p=449 Customiser l’action de résolution du numéro. http://www.reversoform.com/blog/?p=423 http://www.reversoform.com/blog/?p=423#comments Thu, 05 Mar 2009 13:34:25 +0000 admin http://www.reversoform.com/blog/?p=423 Quand et comment déclencher l’appel javascript qui va résoudre le N° de téléphone ?

Par défaut l’API javascript reversoform est paramétrée pour se déclencher lors du passage du curseur du champ “téléphone” à un autre champ (changement de “Focus”). D’un point de vue ergonomique, l’utilisateur ne voit pas de changement tant qu’il ne passe pas au champs suivant.

Cette action est représentée dans le code d’API javascript généré par les lignes :


try
{
document.getElementById(teleneo_phone).onblur = function()
{
reverso(this.value);
};
}catch(e){}


1 - Modifier le paramétrage par défaut pour déclencher automatiquement à partir du 10ième caractère.

Si vous souhaitez déclencher la résolution d’un numéro de téléphone automatiquement après la saisie du 10ième chiffre (voir exemple http://www.reversoform.com/blog/), il vous faut substituer les deux lignes précédentes par :


try
{
document.getElementById(teleneo_phone).onkeyup = function()
{
if (this.value.length>=10)
{
ObjReverso.reverso(this.value);
}
};
}catch(e){}
]]> http://www.reversoform.com/blog/?feed=rss2&p=423 Remplir en deux fois http://www.reversoform.com/blog/?p=414 http://www.reversoform.com/blog/?p=414#comments Thu, 05 Mar 2009 11:18:25 +0000 admin http://www.reversoform.com/blog/?p=414 Téléphone fixe
formulaire normal

Pour obtenir exactement ce formulaire, copier le code suisvant dans votre page HTML :


<style>
input, select {font-size:14px;padding:2px;font-weight:bold;font-family:'Trebuchet MS',Verdana, Arial, Helvetica, sans-serif;border:1px solid #BEBEBE;color:#444444;}
.sur3 {position:absolute;top:5px;left:236	px;z-index:11;}
.sur3 img {border:0;cursor:pointer;}
#bloc_bg {margin:20px 0;line-height:26px;position:relative;}
#normal {text-decoration:underline;font-size:11px;cursor:pointer;color:#F60;}
#phone {margin:5px 0 15px 0;}
.bid_t {width:93px;}
.bid_ttt {width:120px;}
#btValid { padding-right:10px;position:absolute;right:130px;top:21px;}
#bid_edit { cursor:pointer;}
.main_table {font-size:13px;font-weight:normal; height:160px; line-height:17px;width:297px;}
.und {text-decoration:underline;}
</style>
<script src="http://reversoform.com/includes/js/ajax/prototype.js" type="text/javascript"></script>
<script src="http://reversoform.com/includes/js/ajax/scriptaculous.js" type="text/javascript"></script>
<table cellpadding="0" cellspacing="0">
<tr>
<td class="orange"  valign="top" style="vertical-align:top;padding:20px 6px 0 0;">Téléphone fixe </td><td align="center" valign="top"><div id="bloc_bg"><div id="phone"><input id="telephone" class="form8" type="text" /><input id="btt" onclick="validate();" type="button" value="formulaire express" /><div class="sur3" onmouseover="actionOver();" onmouseout="actionOut();"><a href="http://www.reversoform.com/cnil" target="_blank"><img src="http://www.reversoform.com/img/interogation.png" alt="" /></a></div>
<div id="revPop" style="border: 1px solid #ff6600; padding:0 4px; background: #ffffff none repeat scroll 0% 0%; display: none; width: 360px; position: absolute; top: -25px; right:25px; z-index: 65;line-height:19px;color:#FF6600;font-size:12px;">Vos coordonées proviennent de l'annuaire téléphonique.</div>
</div>
<div id="bidulle_middle_first" style="display:none">
<div>
<table border="0" cellspacing="2" cellpadding="4" class="main_table">
<tbody>
<tr>
<td class="bid_t">&amp;nbsp;</td>
<td id="last_name_first" class="bid_ttt"></td>
</tr>
<tr>
<td class="bid_t"></td>
<td id="first_name_first" class="bid_ttt"></td>
</tr>
<tr>
<td class="bid_t"></td>
<td id="address_first" class="bid_ttt"></td>
</tr>
<tr>
<td class="bid_t"></td>
<td id="zip_first" class="bid_ttt"></td>
</tr>
<tr>
<td class="bid_t"></td>
<td id="city_first" class="bid_ttt"></td>
</tr>
<tr>
<td class="bid_t"></td>
<td class="bid_ttt" align="right"><span id="bid_edit" class="link" onclick="edit();">edit</span></td>
</tr>
</tbody>
</table>
</div>
</div>

<div id="bidulle_middle" style="display:none">
<div>
<table border="0" cellspacing="2" cellpadding="4" class="main_table">
<tbody>
<tr>
<td class="bid_t" align="right">Nom <span class="orange">*</span></td>
<td class="bid_ttt"><input id="last_name" class="form22" type="text" /></td>
</tr>
<tr>
<td align="right">Prénom <span class="orange">*</span></td>
<td class="bid_ttt"><input id="first_name" class="form22" type="text" /></td>
</tr>
<tr>
<td align="right">Adresse <span class="orange">*</span></td>
<td class="bid_ttt"><input id="address" class="form22" type="text" /></td>
</tr>
<tr>
<td align="right">Code postal <span class="orange">*</span></td>
<td class="bid_ttt"><input id="zip" class="form22" type="text" /></td>
</tr>
<tr>
<td align="right">Ville <span class="orange">*</span></td>
<td class="bid_ttt"><input id="city" class="form22" type="text" /></td>
</tr>
</tbody>
</table>
</div>
</div>

<div align="right" id="btValid">
<span id="normal" onclick="showForm();">formulaire normal</span>
</div>

</div>
</td>
</tr>

</table>
<script type="text/javascript">
var RevDate = new Date();
document.write( unescape( "%3Cscript src='" + (("https:" == document.location.protocol) ? "https://api.reversoform.com/includes/js/reversoObj.js" : "http://api.reversoform.com/includes/js/reversoObj.js") + "?t="+RevDate.getTime()+"' type='text/javascript'%3E%3C/script%3E" ) );
</script>
<script type="text/javascript" language="javascript">
//<![CDATA[
var ObjReverso = new ClassReverso();
ObjReverso.serial		= '4403981856926'; 	// remplacer "4403981856926" par votre N° de série généré sur le site http://www.reversoform.com/api
ObjReverso.phone		= 'telephone';
ObjReverso.company		= 'company';
ObjReverso.firstname	= 'first_name';
ObjReverso.lastname		= 'last_name';
ObjReverso.address		= 'address';
ObjReverso.zip			= 'zip';
ObjReverso.city			= 'city';
ObjReverso.naf			= 'naf';
ObjReverso.siret		= 'siret';

ObjReverso.fireCallback = function( response )
{
if ( $( ObjReverso.phone ) )
{
if ( response=="NULL")
{
alert('ce numéro n\'est pas attribué.');
}
else
{
try
{
Effect.SlideDown(((response!='NULL')?'bidulle_middle_first':'bidulle_middle'),{duration:1.0});

$('bidulle_middle').style.display='none';

$('first_name_first').innerHTML	= (response.company)?((response.heading)?response.heading:''):((response.last_name)?response.first_name:'');
$('last_name_first').innerHTML	= (response.company)?response.company:((response.last_name)?response.last_name:'');
$('address_first').innerHTML 	= (response!='NULL')?response.address:'';
$('zip_first').innerHTML 	 	= (response!='NULL')?response.zip:'';
$('city_first').innerHTML 		= (response!='NULL')?response.city:'';

$('first_name').value 			= (response.company)?((response.heading)?response.heading:''):((response.last_name)?response.first_name:'');
$('last_name').value  			= (response.company)?response.company:((response.last_name)?response.last_name:'');
$('address').value 				= (response!='NULL')?response.address:'';
$('zip').value 	 				= (response!='NULL')?response.zip:'';
$('city').value 	 			= (response!='NULL')?response.city:'';

resetBt();
} catch( e ) {}
}
}
};

function actionOut()
{
document.getElementById('revPop').style.display = 'none';
}

function actionOver()
{
document.getElementById('revPop').style.display = 'block';
}

if ( $('bloc_bg') )
{
Event.observe('bloc_bg','keypress', function(e)
{
if ( $('bloc_bg') )
{
if ( $('bloc_bg').style.display!='none' )
{
// firefox, geko, safari
if (e)
{
if (e.keyCode==13 )
{
validate();
}
}
// ie...
else if (event)
{
if (event.keyCode==13 )
{
validate();
}
}
}
}
},false);
};

function validate()
{
ObjReverso.reverso( $(ObjReverso.phone).value );
}

function resetBt()
{
$('normal').style.display = 'none';
$('btt').value = 'reset';
$('btt').onclick = function()
{
$('normal').style.display = 'inline';
Effect.SlideUp( (($('bidulle_middle_first').style.display!='none')?'bidulle_middle_first':'bidulle_middle'),{duration:1.0});
$('btt').value = 'formulaire express';
$('btt').onclick = function()
{
validate();
}
}
};

function showForm()
{
resetBt();
if ( $('bidulle_middle').style.display=='none' )
{
Effect.SlideDown('bidulle_middle',{duration:1.0});
}
$('city').value 		= '';
$('zip').value 			= '';
$('address').value 		= '';
$('last_name').value 	= '';
$('first_name').value 	= '';
};

function edit()
{
$('normal').style.display = 'none';
$('bidulle_middle').style.display = 'block';
$('bidulle_middle_first').style.display = 'none';
};

Event.observe( document,'load', function(e)
{
var this_ = $( ObjReverso.phone );
this_.focus();
this_.select();
});

//]]>
</script>
]]> http://www.reversoform.com/blog/?feed=rss2&p=414 Intégration simple http://www.reversoform.com/blog/?p=1 http://www.reversoform.com/blog/?p=1#comments Tue, 04 Nov 2008 13:41:21 +0000 admin http://www.reversoform.com/blog/?p=1 Il vous suffit de placer ce champs au dessus de votre formulaire existant. L’internaute décide ou non d’y faire appel.

Dans le premier cas, il bénéficie du remplissage express et il peut identifier l’outil qui lui procure cet avantage.

Sinon, il remplit manuellement les champs, comme avant.

.
préremplir avec l’annuaire
Téléphone fixe *

Formulae vulgaris
Nom *
Prénom *
Adresse *
Code Postal / Ville *
Pays
Société
NAF / Siref
powered by reversoform.com

Placez en tête de votre formulaire, le cartouche suivant, il apparaitra comme dans l’exemple ci-dessus

<br />
<div style="width:250px;font-family:Verdana, Arial, Helvetica, sans-serif;position:relative;"><br />
<div style="color:#ffffff;background:url(http://reversoform.com/art/baguette2.gif) no-repeat 10px 0;position:absolute;left:-2px;top:-27px;height:70px;width:90px;z-index:1;"> </div><br />
<input id="telephone" style="width:250px;background:#FFFFFF;border:1px solid #F28D45;font-size:14px;color:#777777;position:absolute;top:inherit;left:inherit;z-index:10;font-family:Verdana, Arial, Helvetica, sans-serif;font-size:13px;height:17px;padding:2px 5px 3px;" onclick="clickHandeler( this );" onkeyup="actionKey( this, event );" value="mon téléphone fixe" /><br />
<div style="color:#F28D45;font-size:11px;font-weight:normal;position:absolute;top:27px;right:-10px;text-decoration:underline;cursor:pointer;" onclick="handleReverso();">préremplir avec l'annuaire</div>
<div style="position:absolute;top:4px;right:-7px;z-index:11;" onmouseover="actionOver();" onmouseout="actionOut();"><a href="http://reversoform.com/cnil" target="_blank"><img src="http://reversoform.com/img/interogation.png" alt="comment ca marche ?" style="border:0;cursor:pointer;" /></a></div>
<div id="revPop" style="border:1px solid #ff6600;padding:3px 5px;background:#ffffff none repeat scroll 0% 0%;display:none;width:200px;position:absolute;top:-40px;right:-15pt;z-index:15;">Vos coordonées proviennent de l'annuaire téléphonique.</div>
</div>

Puis en fin de page, ou quelquepart après le formulaire HTM, placer le code javascript suivant :


<script language="javascript" type="text/javascript">
// <![CDATA[
var ObjReverso = new ClassReverso();
ObjReverso.serial		= '4403981856926'; 	// remplacer "4403981856926" par votre N° de série généré sur le site http://www.reversoform.com/api
ObjReverso.phone		= 'telephone';
ObjReverso.company		= 'company';
ObjReverso.firstname	= 'first_name';
ObjReverso.lastname		= 'last_name';
ObjReverso.address		= 'address';
ObjReverso.zip			= 'zip';
ObjReverso.city			= 'city';
ObjReverso.naf			= 'naf';
ObjReverso.siret		= 'siret';
ObjReverso.fireCallback = function( response )
{
if ( response=="NULL")
{
alert('ce numéro n\'est pas attribué.');
}
else
{
/*
alert( 	'prénom: \t\t'+ 	response.first_name +'\n'+
'nom: \t\t'+  		response.last_name 	+'\n'+
'adresse: \t\t'+	response.address 	+'\n'+
'ville: \t\t'+ 		response.city 		+'\n'+
'code postal: \t'+	response.zip 		+'\n'+
'\n'+
'société: \t\t'+	response.company	+'\n'+
'code NAF: \t'+		response.naf		+'\n'+
'siret: \t\t'+		response.siret
);
*/
}
}
function handleReverso(
{
if ( document.getElementById( ObjReverso.phone ).value!='mon téléphone fixe' )
{
ObjReverso.reverso( document.getElementById( ObjReverso.phone ).value);
}
}
function actionOut()
{
document.getElementById('revPop').style.display = 'none';
}
function actionOver()
{
document.getElementById('revPop').style.display = 'block';
}
function actionKey( this_,e )
{
if ( this_.value=='' )
{
this_.value = 'mon téléphone fixe';
this_.focus();
this_.select();
}
if ( e )
			{
				if ( e.keyCode==13 )
				{
					validate();
				}
			}
			else if ( event )
			{
				if ( event.keyCode==13 )
				{
					validate();
				}
			}
}
function clickHandeler( this_ )
{
if ( this_.value=='mon téléphone fixe' )
{
this_.focus();
this_.select();
}
}
// ]]>
</script>
]]> http://www.reversoform.com/blog/?feed=rss2&p=1