
function directory_browser( catid, selid, extra, extra_id ) {

  // Retrouver ses petits
  var varname = selid.replace( /_[0-9]*$/, '' );
  var categories = eval( varname );
  var level = parseInt( selid.replace( /^.*_/, '' ) );
  var brothers = categories['path'][level-1]['childs'];

  for ( var i=0; brothers[i]; i++) {
    if ( brothers[i]['id'] == catid ) {
      var category = brothers[i];
      var childs = brothers[i]['childs'];
      break;
    }
  }

  if ( categories['path'].length == level ) {
    // Si sélection d'un niveau supplémentaire alors ajouter au path
    categories['path'].push( category );
  }
  else if ( document.getElementById( varname+'_'+level ).value == 'NaN' ) {
    // Si une sélection est repassée à NaN retirer du path
    categories['path'].pop();
  }

  // Mettre à jour la valeur dans le formulaire
  var input = document.getElementById( selid.replace( /_[0-9]*$/, '_value' ) );
  var v = (catid == 'NaN' ? 0 : catid);
  if ( v == 0 ) {
    // Si possède parent prendre sa valeur
    var  p = document.getElementById( varname+'_'+(level-1) );
    if ( p ) {
      v = (p.value == 'NaN' ? 0 : p.value);
    }
  }
  input.value = v;

  // Détruire les niveaux inférieurs restants
  var i = 1;
  var sel = document.getElementById( varname+'_'+(level+i) );
  while ( sel ) {
    sel.parentNode.removeChild( sel );
    if ( sel.value != 'NaN' ) {
      categories['path'].pop();
    }
    i++;
    sel = document.getElementById( varname+'_'+(level+i) );
  }
  if (extra=='localiz') {
  sel = document.getElementById('city_id');
  if (sel) {
 	 sel.parentNode.removeChild(sel);
  }
  }
  if ( category && categories['path'][(categories['path'].length-1)]['id'] != category['category_id'] ) {
    // Il y avait déjà une sélection mais on change de valeur
    categories['path'].pop();
    categories['path'].push( category );
  }

  // Si aucune sous-catégories ne rien faire de plus
  if ( !childs ) {
	if (extra == 'localiz') {
		var request = new Request({
									url: 'list_city.php',
									method: 'get', 
									onSuccess: function(responseText) { 
	if (responseText) {
		var json = JSON.decode(responseText);
  		var select = document.getElementById( selid );
		var sub_select = document.createElement( 'select' );
		sub_select.className = 'input_3';
		sub_select.id = 'city_id';
		sub_select.name = selid.replace(/_.*$/, '') + '[city_id]';
		sub_select.options[0] = new Option('Votre choix', '0');
		json.each( function (item) {
			sub_select.options[sub_select.length] = new Option( item['zip'] + ' ' + item['name'], item['city_id'], item['city_id'] == extra_id ? true : false);
		});
		select.parentNode.appendChild(sub_select);
		
	}
									}
									});
		request.send('id='+catid);
	}
    return;
  }

  // Ajouter le select du niveau innférieur
  var select = document.getElementById( selid );
  var sub_select = document.createElement( 'select' );
  sub_select.className = 'input_3';
  sub_select.options[0] = new Option( 'Votre choix', 'NaN' );
  for ( var i=0; childs[i]; i++ ) {
    sub_select.options[i+1] = new Option( childs[i]['name'], childs[i]['id'] );
  }
//  sub_select.style.display = 'block';
  sub_select.id = selid.replace( /_[0-9]*$/, '_'+(categories['path'].length) );
  sub_select.onchange = function() { directory_browser( this.value, this.id, extra, extra_id ) };
  select.parentNode.appendChild( sub_select );

}

