Bonjour,
j'ai un formulaire qui affiche un tableau dont les lignes sont reproduites par une boucle :
<?php
$i=0;
$nb_lignes=10;
?>
<form action="insert.php" method="POST" enctype="multipart/form-data" name="form1" id="form1">
<table cellspacing="5" width="100%">
<thead>
<tr>
<th>Date</th>
<th>Objet</th>
<th>Lieu(x)</th>
<th>N° Dossier(s)</th>
<th>Nb Km</th>
<th>Nb Repas</th>
<th>Autres frais</th>
</tr>
</thead>
<tbody>
<?php for ($i=0; $i<$nb_lignes; $i++) { ?>
<tr style="font-size:13px; color:#666;">
<td> <input type="text" size="8" class="datepicker" id="datepicker<?php echo $i; ?>" name="date_frais<?php echo $i; ?>" placeholder="Date"></td>
<td> <input type="radio" id="tsb<?php echo $i; ?>" name="objet_frais<?php echo $i; ?>" value="bureau" checked> Bureau</br>
<input type="radio" id="dep" name="objet_frais<?php echo $i; ?>" value="déplacement"> Déplacement</td>
<td> <input type="text" size="20" id="lieu" name="lieu<?php echo $i; ?>" placeholder="Commune"></td>
<td> <input type="text" size="15" id="num_dossier" name="num_dossier<?php echo $i; ?>" placeholder="N° de dossier"></td>
<td> <input type="text" size="3" id="nb_km" name="nb_km<?php echo $i; ?>" placeholder="Nb"></td>
<td> <input type="text" size="1" id="nb_repas" name="nb_repas<?php echo $i; ?>" placeholder="Nb"></td>
<td> <input type="text" size="5" id="frais_div" name="frais_div<?php echo $i; ?>" placeholder="montant"></td>
</tr>
<?php } ?>
</tbody>
</table>
<input type="hidden" id="nb_lignes" name="nb_lignes" value="<?php echo $nb_lignes;?>" />
<p align="right"><input type="submit" name="Submit" id="fermer" value="" /></p>
</form>
Je souhaite que lorsque le bouton radio "objet_frais" est sélectionné sur "Bureau", les champs 'lieu', 'nb_km' ,'nb_repas' soit désactivés.
J'ai trouvé un script pour cela, mais je dois mal m'y prendre dans son intégration car il n'a aucun effet.
//DATEPICKER
jQuery(document).ready(function(){
jQuery(function() {
// à mettre du 01 janvier jusqu'au 10 janvier
//jQuery('input').filter('.datepicker').datepicker({minDate: new Date('<?php echo date('Y'-01).'-'.$mois_sel.'-01'; ?>')});
jQuery('input').filter('.datepicker').datepicker({minDate: new Date('<?php echo date('Y').'-'.$mois_sel; ?>'), stepMonths: 1});
});
});
//CHAMPS DISABLED
var form1_inputs = ['lieu','nb_km','nb_repas'];
document.body.onload = function(){
document.getElementById('bureau').onclick = function() {
if (this.checked) {
for(var i in form1_inputs){
if(document.querySelectorAll("input[name='" + form1_inputs[i] + "']").length > 1){
var radios = document.querySelectorAll("input[name='" + form1_inputs[i] + "']");
for(var j in radios){
if(typeof radios[j].setAttribute === 'function'){
radios[j].checked = false;
radios[j].setAttribute("disabled", "");
}
}
}
document.querySelector("input[name='" + form1_inputs[i] + "']").value = "";
document.querySelector("input[name='" + form1_inputs[i] + "']").setAttribute("disabled", "");
}
}
};
document.getElementById('deplacement').onclick = function() {
for(var i in form1_inputs){
if(document.querySelectorAll("input[name='" + form1_inputs[i] + "']").length > 1){
var radios = document.querySelectorAll("input[name='" + form1_inputs[i] + "']");
for(var j in radios){
if(typeof radios[j].setAttribute === 'function'){
radios[j].checked = false;
radios[j].removeAttribute("disabled");
}
}
}
document.querySelector("input[name='" + form1_inputs[i] + "']").removeAttribute("disabled");
}
};
};
Auriez-vous une idée ?
Merci pour l'aide