Interférence avec Mselect ?
Plop,
J'aimerai l'aide des développeurs du web qui sont dans le coin!!!!
J'ai ma page index.php qui contient l'appel aux différents script et qui affiche le template du site.
Les appels au scripts:
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25
|
<script type="text/javascript" src="/javascript/table.js"></script>
<script type="text/javascript" src="/javascript/jquery.js"></script>
<script type="text/javascript" src="/javascript/filtre_membre.js"></script>
<script type="text/javascript" src="/javascript/jquery.mSelect.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#select_club').mSelect({
eventClick:function(value,html) {
alert(value);
alert(this);
tableau_membres();
}
});
$('#select_level').mSelect({
eventClick:function(value,html) {
alert(value);
alert(this);
tableau_membres();
}
});
});
</script> |
Un morceau de mon menu:
Code:
1 2 3 4
|
<li>
<a href="?p=membres">Membres</a>
</li> |
Pour ceux qui ont compris le principe j'ai une feuille "fonction.php" qui récupère la variable "p" et qui retourne l'affichage en conséquence.
Dans mon cas lorsque "p" vaut "membres" la page fonction.php fait appel à une fonction qui affiche 3 filtres (2 select et 1 champ texte) puis le tableau des membres:
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37
|
$options_club = "<option value=\"-1\">Filtrer par Club</option>";
for($i=0; $i<count($select_c);$i++) {
$options_club .= "<option value=\"".$select_c[$i]->id_club."\">".$select_c[$i]->libelle."</option>";
}
$select_level = "SELECT * FROM `level`";
$select_l = select_gen($select_level, $connexion);
$options_level = "<option value=\"-1\">Filtrer par Level</option>";
for($i=0; $i<count($select_l);$i++) {
$options_level .= "<option value=\"".$select_l[$i]->id_level."\">".$select_l[$i]->level."</option>";
}
$chaine = "
<div class=\"filtre_membres\">
<form id=\"form_search_membre\" name=\"form_search_membre\" action=\"javascript:tableau_membres();\" method=\"post\" enctype=\"multipart/form-data\">
<select class=\"styled\" id=\"select_club\" onchange=\"tableau_membres();\">
".$options_club."
</select>
<select name=\"level\" id=\"select_level\" onchange=\"tableau_membres();\">
".$options_level."
</select>
<input type=\"text\" name=\"recherche_membre\" id=\"recherche_membre\" size=\"10\"/>
</form>
</div>
<div id=\"liste_membre\">
<table class=\"listing\">
.
.
. |
Le div "liste_membre" est utilisé pour reconstruire le tableau lorsque l'utilisateur modifie les filtres.
Mon problème apparaît dans la feuille "filtre_membre.js" qui est utilisé pour reconstruire le tableau des membres en récupérant les valeurs des filtres:
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55
| function getXhrFiltre(){
var xhr = null;
if(window.XMLHttpRequest) // Firefox et autres
xhr = new XMLHttpRequest();
else
if(window.ActiveXObject){ // Internet Explorer
try {
xhr = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
}
else { // XMLHttpRequest non supporté par le navigateur
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
xhr = false;
}
return xhr
}
/**Retourne la valeur du select selectId*/
function getSelectValue(selectId)
{
var selectElmt = document.getElementById(selectId);
return selectElmt.options[selectElmt.selectedIndex].value;
}
/**
Fonction qui récupère les valeurs des filtres (select et text)
et utilise la page tableau_membre.php pour reconstruire la liste des membres
**/
function tableau_membres(){
var xhr = getXhrFiltre();
xhr.onreadystatechange = function(){
if(xhr.readyState == 4 && xhr.status == 200){
leselect = xhr.responseText;
document.getElementById('liste_membre').innerHTML = leselect;
Table.auto();
}
}
xhr.open("POST","tableau_membre.php",true);
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
// On récupére l'id du club
id_club = getSelectValue('select_club');
// On récupére l'id du level
id_level = getSelectValue('select_level');
// On récupère le filtre entré par l'utilisateur
like = document.getElementById('recherche_membre').value;
xhr.send("id_club="+id_club+"&id_level="+id_level+"&contient="+like);
} |
Firebug me donne ce message d'erreur lorsque je modifie un de mes filtres:
selectElmt.selectedIndex is undefined
Le problème "doit" venir d'une "interférence" entre mon fichier "filtre_membre.js" et l'utilisation du plugin mselect car lorsque je n'utilise plus mselect je n'ai plus d'erreur...
Quelqu'un pourrait m'éclairer ?
Merci d'avance.