11548 sujets

JavaScript, DOM et API Web HTML5

Merci à Ghost !! Smiley cligne
La solution c'était mettre les fieldset en absolute et faire quelque modifs comme retitrer des div devenues inutiles...
le html modifié ci-dessous:

<div id="frm" style="float:left; border:#FFCC00 3px outset; background-color:#CCCCCC;; padding:10px;width:800px;position: relative;">

<form method="post" action="?mode=delete" enctype="multipart/form-data" name="form_del">
	<input name="photo_form_id" type="hidden" value="1"><!--...Premiere etape : choix des photos...-->
	<h2>Selection des photos à supprimer: </h2>
	<br/>
	<fieldset style="width:250px; height:100px; padding-left:10px;">

	    <legend style="color:#003399">
	        &nbsp;Pour...&nbsp;&nbsp;
		</legend>
        <br/>
        <table summary="" style="margin-left:20px;">
	        <tr>
	            <td>
					<label>

						<input type="radio" name="photo_type" value="1" onClick="change_choix_bien(form_del)">
                        ... tout un batiment ?
                    </label>
				</td>
            </tr>
            <tr>
	        	<td>
	                <label>
		                <input type="radio" name="photo_type" value="2" onClick="change_choix_bien(form_del)">

        	            ... un bien en particulier ?
            	    </label>
               	</td>
			</tr>
		</table>
        <br/>
	</fieldset>

    <fieldset style="width:380px; height:100px; visibility: hidden; position: absolute; top: 50px; left: 330px; padding-left:10px;" id="choix_bien">
	<legend style="color:#003399">

		&nbsp;Choix du bien:&nbsp;&nbsp;
	</legend>
	<br/>
	<table summary="">
	    <tr>
	        <td>
	            <select name="photo_bien_id">
	                <option value="11">&nbsp;&nbsp;A Bragança:&nbsp;6 Appartements Type F3 et F4			&nbsp;&nbsp;</option><option value="8">&nbsp;&nbsp;A Bragança:&nbsp;6 Appartements de type F4			&nbsp;&nbsp;</option><option value="9">&nbsp;&nbsp;A Bragança:&nbsp;4 Appartements de type F5						&nbsp;&nbsp;</option><option value="10">&nbsp;&nbsp;A Bragança:&nbsp;10 Garages en sous sol			&nbsp;&nbsp;</option><option value="12">&nbsp;&nbsp;A Bragança:&nbsp;10 Garages en sous-sol			&nbsp;&nbsp;</option><option value="13">&nbsp;&nbsp;A Bragança:&nbsp;1 F3 au 3ème étage Droite avec Garage			&nbsp;&nbsp;</option><option value="16">&nbsp;&nbsp;A Coimbra:&nbsp;Pas encore d'apart à proposer&nbsp;&nbsp;</option><option value="17">&nbsp;&nbsp;A Seixal:&nbsp;Pas encore d'Apart à Proposer						&nbsp;&nbsp;</option><option value="15">&nbsp;&nbsp;A Portimaõ:&nbsp;Pas encore de Desc			&nbsp;&nbsp;</option><option value="18">&nbsp;&nbsp;A Rabat:&nbsp;Pas encore d'apart à proposer&nbsp;&nbsp;</option><option value="19">&nbsp;&nbsp;A El-Jadida:&nbsp;Pas encore d'apart à proposer&nbsp;&nbsp;</option><option value="20">&nbsp;&nbsp;A Marrakech:&nbsp;Pas encore d'apart à proposer&nbsp;&nbsp;</option>				</select> 
					</td>

				</tr>
			</table>
			<br/>
	</fieldset>

	<fieldset style="width:380px; height:100px; visibility: hidden; position: absolute; top: 50px; left: 330px; padding-left:10px;" id="choix_bat">
		<legend style="color:#003399">
			&nbsp;Choix du batiment&nbsp;&nbsp;
		</legend>

        <br/>
        <table summary="">
	        <tr>
				<td>
					<select name="photo_bien_id">
						<option value="1">&nbsp;&nbsp;A Bragança:&nbsp;Immeuble en construction&nbsp;&nbsp;</option><option value="2">&nbsp;&nbsp;A Bragança:&nbsp;Immeuble prêt à habiter&nbsp;&nbsp;</option><option value="3">&nbsp;&nbsp;A Coimbra:&nbsp;Pas encore de bien connus...&nbsp;&nbsp;</option><option value="4">&nbsp;&nbsp;A Seixal:&nbsp;Pas encore de bien connus...&nbsp;&nbsp;</option><option value="14">&nbsp;&nbsp;A Portim&atilde;o:&nbsp;Pas encore de donn&eacute;es en FR&nbsp;&nbsp;</option><option value="5">&nbsp;&nbsp;A Rabat:&nbsp;Pas encore de bien connus...  	&nbsp;&nbsp;</option><option value="6">&nbsp;&nbsp;A El-Jadida:&nbsp;Pas encore de bien connus...  	&nbsp;&nbsp;</option><option value="7">&nbsp;&nbsp;A Marrakech:&nbsp;Pas encore de bien connus...  	&nbsp;&nbsp;</option>		
					</select> 
               	</td>

			</tr>
		</table>
		<br/>
	</fieldset>        
	<br style="clear:both;"/>
	<br/>
	<div style="float:left;width:300px;">
		<fieldset style="width:250px; height:150px; padding-left:10px;">
			<legend  style="color:#003399">

				&nbsp;Cat&eacute;gories:&nbsp;
			</legend>
			<br/>   
			<table summary="" style="margin-left:20px;">
				<tr>
					<td>
						<label>
							<input type="radio" name="photo_cat" value="1" checked="checked" onClick="change_choix_cat(form_del)">

							Toutes Cat&eacute;gories
						</label>
					</td>
				</tr>
				<tr>
					<td>
						<label>
							<input type="radio" name="photo_cat" value="2" onClick="change_choix_cat(form_del)">
							Certaines Cat&eacute;gories seulement
						</label>

					</td>
				</tr>
				<tr>
					<td>	
						<label>
							<input type="radio" name="photo_cat" value="3" onClick="change_choix_cat(form_del)">
							Choisir les photos à supprimer
						</label>
					</td>
				</tr>

			</table>
			<br/>
		</fieldset>
		<br/>
	</div>
	<div style="float:left; margin-left:20px;">
		<fieldset style="width:360px; height:150px; visibility:hidden; padding-left:20px" id="choix_cat">
			<legend style="color:#003399">
				&nbsp;Choix de la cat&eacute;gorie:&nbsp;&nbsp;

			</legend>
			<br/>
			<table summary="">
				<tr>
					<td>
						<input name="photo_cat_choix[]" type="checkbox" value="1">&nbsp;&nbsp;Construction<br/><br/><input name="photo_cat_choix[]" type="checkbox" value="2">&nbsp;&nbsp;Interieurs<br/><br/><input name="photo_cat_choix[]" type="checkbox" value="3">&nbsp;&nbsp;Exterieurs<br/><br/><input name="photo_cat_choix[]" type="checkbox" value="4">&nbsp;&nbsp;Garages<br/><br/>					</td>

				</tr>
			</table>
            <br/>
		</fieldset>
	</div>
	<br style="clear:both;"/>
	<br/>
	<input name="submit" type="submit" value="&nbsp;Valider&nbsp;">
	<br/>

	<br/>
</form>

</div>

et merci à CPascal Smiley cligne
Modifié par JMB (01 Jun 2007 - 16:25)
Salut,

j'ai pas tous suivi et ayant été sur le lien je me suis trouvé sur une page sans le dit formulaire.

en clicquant partout j'ai fini par le trouver je crois...
en plus j'ai pas de photos ( et même pas un bien immobilier a vendre Smiley bawling ) donc difficile de tester.

mais quand tu dis
a écrit :
il prend évidement de la 'place', même 'caché', et cela nuit à l'esthétique du formulaire


j'ai l'impression que tu as utilisé la propriété visibility pour masquer/demasquer.

il y a aussi display:none;/display:block;(ou inline pour un element inline) qui masque Et retire l'element.

edit: oui j'ai vu que c'etait encore en construction. merci d'avoir arrangé le lien
Modifié par CPascal (31 May 2007 - 11:33)