Bonsoir,
J'ai un problème de compatibilité entre navigateurs !
Ok avec Opera, Chrome, Firefox et Safari.
Par contre avec IE7 IE8 IE9, les lignes inférieures (sous les 4 listes liées) n'apparaissent pas !
D'avance merci.
Voici le code javascript entre head et /head de "boutique00.php", en partie :
Voici "boutique00.php", en partie :
Et voici "ajaxcategorie04.php", car je crois que c'est là que cela se passe :
Modifié par jytest (07 Jul 2012 - 10:31)
J'ai un problème de compatibilité entre navigateurs !
Ok avec Opera, Chrome, Firefox et Safari.
Par contre avec IE7 IE8 IE9, les lignes inférieures (sous les 4 listes liées) n'apparaissent pas !
D'avance merci.
Voici le code javascript entre head et /head de "boutique00.php", en partie :
// categorie03
function gocategorie03() {
getXhr();
// On définit ce qu'on va faire quand on aura la réponse
xhr.onreadystatechange = function() {
// On ne fait quelquechose que si l'on a tout reçu et que le serveur est OK
if (xhr.readyState == 4 && xhr.status == 200) {
document.getElementById("loader03").style.display = "none";
leselect = xhr.responseText;
// On se sert de innerHTML pour rajouter les options à la liste
document.getElementById('detail').innerHTML = leselect;
} else {
document.getElementById("loader03").style.display = "inline";
}
}
// Ici on va voir comment faire du post
xhr.open("POST","php/ajaxcategorie04.php",true);
// Ne ps oublier ç pour le post
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
// Ne ps oublier de poster les arguments
// ici l'id de cat01
sel = document.getElementById('categorie03');
idcategorie03 = sel.options[sel.selectedIndex].value;
xhr.send("ix="+idcategorie03);
// Ouverture du tableau devis
var selectValue = getSelectValue('categorie03');
if (selectValue == "" || selectValue == "none") {
hidden = 5;
} else {
hidden = 6;
}
document.getElementById("tr04").style.display = "";
document.getElementById("tr05").style.display = "";
document.getElementById("tr06").style.display = "";
document.getElementById("tr07").style.display = "";
document.getElementById("tr08").style.display = "";
document.getElementById("tr09").style.display = "";
document.getElementById("tr10").style.display = "";
for (hidden=11; hidden<11; hidden++) {
document.getElementById("tr0"+hidden).style.display = "none";
}
}
Voici "boutique00.php", en partie :
<table border="0" align="left" cellspacing="0" id="tableoptions" style="vertical-align:middle;">
<tr>
<td width="150"></td>
<td width="280"></td>
<td width="20"></td>
<td width="0"></td>
</tr>
<tr>
<td colspan="4" style="padding:7px;" bgcolor="#0E72B5" class="blanc bold">Prix en ligne instantané</td>
</tr>
<tr>
<td colspan="4" style="padding:7px;">
Afin d'établir un devis,<br>veuillez choisir parmi toutes les options suivantes :</td>
</tr>
<tr id="tr00">
<td width="136" style="padding:7px;">Document</td>
<td width="280" id="td00">
<select name="categorie00" id="categorie00" style="width:280px;" onChange="gocategorie00();" >
<option value="none">-- Choisissez, svp ! --</option>
<?php
require_once("php/connexionMysql.inc.php");
$query = mysql_query("SELECT * FROM shop_categorie00 ORDER BY id");
while ($back = mysql_fetch_assoc($query)) {
echo "<option value='".$back['id']."' ><span style='width: 280px;' >".$back['libelle']."</span></option>";
}
?>
</select>
</td>
<td width="20">
<span id="loader00" class="hidden" style="width:20px;"><img src="images/boutique/loader16.gif" alt="loading" width="16" height="16" border="0" align="absmiddle" /></span>
</td>
<td width="0"> </td>
</tr>
<tr id="tr01" style="display:none;">
<td width="136" style="padding:7px;">Descriptif</td>
<td width="280" id="td01">
<!-- <select name="categorie01" id="categorie01" style="width:280px;"></select> -->
</td>
<td width="20">
<span id="loader01" class="hidden" style="width:20px;"><img src="images/boutique/loader16.gif" alt="loading" width="16" height="16" border="0" align="absmiddle" /></span>
</td>
<td width="0"> </td>
</tr>
<tr id="tr02" style="display:none;">
<td width="136" style="padding:7px;">Format</td>
<td width="280" id="td02">
<!-- <select name="categorie02" id="categorie02" style="width:280px;"></select> -->
</td>
<td width="20">
<span id="loader02" class="hidden" style="width:20px;"><img src="images/boutique/loader16.gif" alt="loading" width="16" height="16" border="0" align="absmiddle" /></span>
</td>
<td width="0"> </td>
</tr>
<tr id="tr03" style="display:none;">
<td width="136" style="padding:7px;">Papier</td>
<td width="280" id="td03">
<!-- <select name="categorie03" id="categorie03" style="width:280px;"></select> -->
</td>
<td width="20">
<span id="loader03" class="hidden" style="width:20px;"><img src="images/boutique/loader16.gif" alt="loading" width="16" height="16" border="0" align="absmiddle" /></span>
</td>
<td width="0"> </td>
</tr>
</table>
<table id="detail">
</table>
Et voici "ajaxcategorie04.php", car je crois que c'est là que cela se passe :
<?php
require_once("connexionMysql.inc.php");
echo "<table name='table' id='table'>";
if (isset($_REQUEST['ix'])) {
$query = mysql_query("SELECT * FROM shop_articles".
" WHERE id=".$_REQUEST['ix']);
while ($back = mysql_fetch_assoc($query)) {
echo "<tr id='tr04'><td width='150' style='padding-left:5px;'>Réf.</td><td width='280' id='td04' style='padding-left:4px;'>".$back['reference']."</td><td width='20'></td><td width='0'></td></tr>";
echo "<tr id='tr05'><td width='150' style='padding-left:5px;'>Description</td><td width='280' id='td05' style='padding-left:4px;'>".$back['designation']."</td><td width='20'></td><td width='0'></td></tr>";
echo "<tr id='tr06'><td width='150' style='padding-left:5px;'>Délai</td><td width='280' id='td06' style='padding-left:4px;'>".$back['delai']."</td><td width='20'></td><td width='0'></td></tr>";
echo "<tr id='tr07'><td width='150' style='padding-left:5px;'>Commentaires</td><td width='280' id='td07' style='padding-left:4px;'>".$back['commentaire']."</td><td width='20'></td><td width='0'></td></tr>";
}
}
echo "</table>";
?>
Modifié par jytest (07 Jul 2012 - 10:31)