Jump to content

[JS] Script address sur la page authentication.tpl


Recommended Posts

Bonjour a tous,

 

Je suis en train de develloper un script permettant au client lors de son inscription de pouvoir choisir sa ville son code postal et son addresse dans des liste déroulante liées.

 

Vous pouvez le voir en fonctionnement a cette adresse : http://cluster010.ov...hentication.php

 

Alors avan d'exposer mon probleme je vais deja vous en dire un peu plus:

 

Tout d'abord voici la partie du formulaire qui nous interresse :

 

<p class="required text" id="form_zone">
  <label for="id_default_group">Zone :</label>
  <select id="id_default_group" name="id_default_group" class="text" onchange="affichecodepostal(this.value);" >
<option selected  value="0">-----------</option>
<option value="7">CAB</option>
<option value="8">Le touquet</option>
<option value="9">Hors zone</option>
  </select>
  <sup>*</sup>
 </p>
 <p class="required text" id="form_codepostal" >

 </p>
 <p class="required text" id="form_ville">

 </p>
 <p class="required text" id="form_typevoie">

 </p>
 <p class="required text" id="form_nomvoie">
 </p>
 <p class="required text" id="form_numvoie">
 </p>
 <p class="required text" style="display:none;" id="form_address1">
  <label for="address1">{l s='Address'}</label>
  <input type="text" class="text" name="address1" id="address1" value="" />
  <sup>*</sup>
 </p>

<p class="cart_navigation required submit">
	<input type="hidden" name="email_create" value="1" />
	{if isset($back)}<input type="hidden" class="hidden" name="back" value="{$back|escape:'htmlall':'UTF-8'}" />{/if}
	<input type="submit" name="submitAccount" id="submitAccount" onClick="concat_address()" value="" class="bouton_validez" />
	<span><sup>*</sup>{l s='Required field'}</span>
</p>

 

Ensuite le script :

 


function affichecodepostal(zone)
{
var form_d="";
if(zone != "0")
{ if (zone == "7")
 {
  form_d  = '<label for="postcode">Code Postal</label><select class="text" name="postcode" id="postcode" onchange="afficheville(this.value,tabcab);"  >';
  form_d +='<option selected value="0">------------</option>';
  form_d +='<option value="62200">62200</option>';
  form_d +='<option value="62280">62280</option>';
  form_d +='<option value="62360">62360</option>';
  form_d +='<option value="62480">62480</option>';
  form_d +='<option value="62230">62230</option>';
  form_d +='<option value="62126">62126</option>';
  form_d +='<option value="62152">62152</option>';
  form_d +='<option value="62187">62187</option>';
  form_d +='<option value="62224">62224</option>';
  form_d +='<option value="62930">62930</option>';
  form_d += '</select><sup>*</sup>';
 }
 if (zone == "8")
 {
  form_d  = '<label for="postcode">Code Postal</label><select class="text" name="postcode" id="postcode" onchange="afficheville(this.value,tabtouquet);"  >';	
  form_d +='<option selected value="0">------------</option>';
  form_d +='<option value="62520">62520</option>';
  form_d +='<option value="62155">62155</option>';
  form_d +='<option value="62170">62170</option>';
  form_d +='<option value="62780">62780</option>';
  form_d +='<option value="62630">62630</option>';
  form_d +='<option value="62176">62176</option>';
  form_d += '</select><sup>*</sup>';
 }
}else{
   form_d = "";
}
/* Remise a zero des champs suivant. */

if (zone=="0" || zone=="7" || zone=="8" || zone=="9")
{
 document.getElementById("form_ville").innerHTML = "";
	document.getElementById("form_typevoie").innerHTML = "";
	document.getElementById("form_nomvoie").innerHTML = "";
	document.getElementById("form_numvoie").innerHTML = "";
	document.getElementById("form_address1").style.cssText = "display:none;";
 document.getElementById("form_address2").style.cssText = "display:none;";
}
if (zone=="9") /* Gestion du hors Zone */
{
 document.getElementById("form_address1").style.cssText = "display:block;";
 document.getElementById("form_address2").style.cssText = "display:block;";
 document.getElementById("form_codepostal").innerHTML = '<label for="postcode">Code Postal :</label><input type="text" class="text" name="postcode" id="postcode"  /><sup>*</sup>';
 document.getElementById("form_ville").innerHTML = '<label for="city">Ville :</label><input type="text" class="text" name="city" id="city"  /><sup>*</sup>';
}else{
document.getElementById("form_codepostal").innerHTML = form_d;
}
}
function afficheville(codepostal,tabzone)
{

var select_ville="";
var temoin_ville="";
if (tabzone[0]['id_zone']==7)
{
 select_ville +='<label for="city">Ville</label><select  class="text" name="city" id="city" onchange="affichetypevoie(this.value,tabcab)"  />';
}
else if (tabzone[0]['id_zone']==8)
{
 select_ville +='<label for="city">Ville</label><select  class="text" name="city" id="city" onchange="affichetypevoie(this.value,tabtouquet)"  />';
}
select_ville +='<option selected value="0">------------</option>';
for (var i=0; i<tabzone.length; i++)
{

 if (codepostal == tabzone[i]['zip_code'])
 {
  if(temoin_ville != tabzone[i]['city'])
  {
select_ville += '<option value="'+ tabzone[i]['city'] +'">'+ tabzone[i]['city'] +'</option>';
temoin_ville=tabzone[i]['city'];
  }
 }
}
select_ville += '</select><sup>*</sup>';
document.getElementById("form_ville").innerHTML = select_ville;
document.getElementById("form_typevoie").innerHTML = "";
document.getElementById("form_nomvoie").innerHTML = "";
document.getElementById("form_numvoie").innerHTML = "";
}
function affichetypevoie(ville,tabzone)
{
var select_typevoie="";
var temoin_typevoie="";
if (tabzone[0]['id_zone']==7)
{
 select_typevoie +='<label for="typevoie">Type de voie:</label><select  class="text" name="typevoie" id="typevoie" onchange="affichenomvoie(this.value,tabcab)"  />';
}
else if (tabzone[0]['id_zone']==8)
{
 select_typevoie +='<label for="typevoie">Type de voie:</label><select  class="text" name="typevoie" id="typevoie" onchange="affichenomvoie(this.value,tabtouquet)"  />';
}
select_typevoie +='<option selected value="0">------------</option>';
for (var i=0; i<tabzone.length; i++)
{

 if (ville == tabzone[i]['city'])
 {
  if(temoin_typevoie != tabzone[i]['way_type'])
  {
select_typevoie += '<option value="'+ tabzone[i]['way_type'] +'">'+ tabzone[i]['way_type'] +'</option>';
temoin_typevoie=tabzone[i]['way_type'];
  }
 }
}
select_typevoie += '</select><sup>*</sup>';
document.getElementById("form_typevoie").innerHTML = select_typevoie;
document.getElementById("form_nomvoie").innerHTML = "";
document.getElementById("form_numvoie").innerHTML = "";
}
function affichenomvoie(typevoie,tabzone)
{
var select_nomvoie="";
var villeencours=document.getElementById('city').options[document.getElementById('city').selectedIndex].value;
if (tabzone[0]['id_zone']==7)
{
 select_nomvoie +='<label for="nomvoie">Nom de voie:</label><select  class="text" name="nomvoie" id="nomvoie" onchange="affichenumvoie(this.value,tabcab)"  />';
}
else if (tabzone[0]['id_zone']==8)
{
 select_nomvoie +='<label for="nomvoie">Nom de voie:</label><select  class="text" name="nomvoie" id="nomvoie" onchange="affichenumvoie(this.value,tabtouquet)"  />';
}
select_nomvoie +='<option selected value="0">------------</option>';
for (var i=0; i<tabzone.length; i++)
{
 if (villeencours==tabzone[i]['city'])
 {
  if (typevoie == tabzone[i]['way_type'])
  {

 select_nomvoie += '<option value="'+ tabzone[i]['way_name'] +'">'+ tabzone[i]['way_name'] +'</option>';

  }
 }
}
select_nomvoie += '</select><sup>*</sup>';
document.getElementById("form_nomvoie").innerHTML = select_nomvoie;
}
function affichenumvoie()
{
var input_numvoie='<label for="numvoie">Numero :</label><input type="text" class="text" size=3 name="numvoie" id="numvoie" style="width:40px;"  /><sup>*</sup>';
document.getElementById("form_numvoie").innerHTML = input_numvoie;
}
function concat_address()
{
var zone_choisi= document.getElementById('id_default_group').options[document.getElementById('id_default_group').selectedIndex].value;
if ((zone_choisi==7)||(zone_choisi==8))
{
 var concat_add = "";
 concat_add+= document.getElementById('numvoie').options[document.getElementById('numvoie').selectedIndex].value;
 concat_add+= document.getElementById('nomvoie').options[document.getElementById('nomvoie').selectedIndex].value;
 concat_add+= document.getElementById('numvoie').options[document.getElementById('numvoie').selectedIndex].value;
 document.getElementById("form_address1").innerHTML = "";
 var form_add='<label for="address1">Adresse :</label><input type="text" class="text" name="address1" id="address1" value="';
 form_add+=concat_add;
 form_add+='" /><sup>*</sup>';
 document.getElementById("form_address1").innerHTML = form_add;
}
}

 

Pour que le script fonctionne je lui envoi deux tableaux contenant les informations a affichées.

 

Le decor est posé. Je vais maintenant expliquer mon soucis: La concatenation du nom de la voie de son numero et du type voie.

Lors de la validation du formulaire je recupere avec ma fonction concat_address ces info les concatene et je les envoi a l'input id="address1" pour que la validation du formulaire se passe bien.

Or pas moyen, j'ai toujours l'erreur address1 manquante lorsque je valide le formulaire.

Quelqu'un aurai t'il une petite idée??

 

Merci d'avance

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...