extranet/application/views/default/scripts/bdf/index.phtml

<style>
#identifiant {
	float:left;
	width:40%;
}
#modules {
	float:left;
	width:40%;
}

#listeModules {
	position:absolute;
	width:500px;
	display:none;
	background-color:#FBF7AA;
	border:1px solid #000000;
	z-index:3;
}

#closelisteModules {
	float:right;
	padding:0.4em 1em;
}

#listeModules ul {
	width:100%;
	margin-left:-10px;
	list-style-type:none;
}

#listeModules ul li {
	display:inline;
	float:left;
	width:50%;
}
</style>

<div id="center">

<h1>Banque de France - Modules</h1>
<h2>Recherche FIBEN / FCC identifiant unique</h2>
<div class="paragraph">
<form name="rFibenU" method="post" action="/?page=bdf">
<input type="hidden" name="type" value="u"/>
<input type="hidden" name="siret" value="<?=$this->siret?>"/>

<div id="identifiant">
<label>Identifiant</label> <input type="text" name="req" value="<?=$this->req?>"/>
<br/><span>SIREN ou clé BDF</span>
</div>
<div id="modules" class="clearfix">
<a href='#' id="listeModulesD">Liste des modules</a>
<span id="selected">
<?php if ($this->module && is_array($this->module)){ ?>
<?php
		foreach ($this->listModulesFiben as $id => $module) {
		    if (isset($module['liste']) == false || $module['liste'] !== false) {
		        if (in_array($id, $this->module))
		        {
   			    	echo '<br/>'.$module['titre'];
		        }
		    }
		}
		foreach ($this->listModulesFcc as $id => $module) {
		    if (isset($module['liste']) == false || $module['liste'] !== false) {
		    	if (in_array($id, $this->module))
		        {
   			    	echo '<br/>'.$module['titre'];
		        }
		    }
		}
?>		
<?php } ?>
</span>
</div>
<div id="listeModules">
<a href="#" id="closelisteModules">Fermer</a>
<ul>
<?php
foreach ($this->listModulesFiben as $id => $module) {
    if (isset($module['liste']) == false || $module['liste'] !== false) {
    	$checked = '';
    	if (isset($this->module) && is_array($this->module) && in_array($id, $this->module))
	    {
	    	$checked = 'checked';
	    }
?>
<li>
	<input type="checkbox" name="module[]" value="<?=$id?>" <?=$checked?>/>
	<?=$module['titre']?>
</li>
<?php
    }
}
foreach ($this->listModulesFcc as $id => $module) {
    if (isset($module['liste']) == false || $module['liste'] !== false) {
        $checked = '';
        if (isset($this->module) && is_array($this->module) && in_array($id, $this->module))
	    {
	    	$checked = 'checked';
	    }
?>
<li>
	<input type="checkbox" name="module[]" value="<?=$id?>" <?=$checked?>/>
	<?=$module['titre']?>
</li>
<?php
    }
}
?>
</ul>
<br/>
</div>
<input class="button" type="submit" name="rFiben" value="Afficher"/>
</form>
</div>
<br/>

<h2>Recherche FIBEN / FCC identifiants multiples</h2>
<div class="paragraph">
<form name="rFibenM" method="post" action="/?page=bdf">
<input type="hidden" name="type" value="m"/>
<input type="hidden" name="siret" value="<?=$siret?>"/>
<div id="identifiant">
<label>Identifiant</label>
<input type="text" name="identifiant[]" value="<?=$req?>" />
<a href="#" id="addIdentifiant">Ajouter</a>
</div>

<div id="modules" class="clearfix">
<label>Module</label>
<select name="module">
<?php
	foreach ($this->listModulesFiben as $id => $module) {
	    if (isset($module['liste']) == false || $module['liste'] !== false) {
	        echo '<option value="'.$id.'">'.$module['titre'].'</option>';
	    }
	}
	foreach ($this->listModulesFcc as $id => $module) {
	    if (isset($module['liste']) == false || $module['liste'] !== false) {
   	        echo '<option value="'.$id.'">'.$module['titre'].'</option>';
	    }
	}
	?>
</select>
</div>
<input class="button" type="submit" name="rFiben" value="Afficher"/>
</form>
</div>
<br/>

<h2>Recherche FICP</h2>
<div class="paragraph">
<form name="rFicp" method="post" action="./?page=bdf">
<input type="hidden" name="module" value="G"/>
<input type="hidden" name="service" value="ficp"/>
<label>Clé BDF</label>
<input type="text" name="req"/>
<input class="button" type="submit" name="rFicp" value="Ok"/>
</form>
</div>

</div>

<script>
$(document).ready(function(){
	$('#listeModulesD').click(function(){
		var position = $(this).position();
		$('#listeModules').css('top', position.top);
		$('#listeModules').css('left', position.left-200);
		var display = $('#listeModules').css('display');
		if(display=='none')	$('#listeModules').css('display', 'block');
		else $('#listeModules').css('display', 'none');
	});

	$('#closelisteModules').click(function(){
		$('#listeModules').css('display', 'none');
		$('#modules > #selected').html('');
		$('input[name="module[]"]').each(function(){
			if ($(this).prop('checked')){
				$('#modules > #selected').append('<br/>'+$(this).parent().text());
			}
		});
	});

	$('#addIdentifiant').click(function(){
		$('form[name=rFibenM] > #identifiant').append('<br/><label>Identifiant</label> <input type="text" name="identifiant[]" />');
	});
});
</script>