Twitter iPhone pliant OnePlus 11 PS5 Disney+ Orange Livebox Windows 11

Mootools, ajax et checkboxes

1 réponse
Avatar
Jean Ceugniet
Salut,

Je viens de faire ma toute première soumission de formulaire en ajax.
Cette partie là fonctione (myAjax01 est une variable externe à la fonction).

*****************************************************
Code >>
*****************************************************
$("formRecherche").addEvent("submit", function(e) {
/**
* Prevent the submit event
*/
new Event(e).stop();
/**
* This empties the log and shows the spinning indicator
*/
$("formRecherche").className = "ajax_loading_01";
/**
* send takes care of encoding and returns the Ajax instance.
* onComplete removes the spinner from the log.
*/
myAjax01 = this.send({
onComplete: function() {
formRechercheMaj (myAjax01);
}
});
});
*****************************************************
<< Code
*****************************************************

mais je voudrais enlever le bouton submit (visuellement), et rendre les
checkboxes "actives" : elles devraient déclencher la même requète ajax
que si le formulaire était soumis, à chaque fois qu'une checkbox est
cochée ou décochée, et cette partie là ne marche pas (j'utilise
probablement la propagation d'évènement de façon incorrecte, mais je ne
vois pas où).

*****************************************************
Code >>
*****************************************************
$$("#formRecherche input").each (function (champ)
{
if (champ.type == "checkbox")
{
champ.addEvent ("click", function ()
{
$("formRecherche").fireEvent ("submit");
});
}
});
*****************************************************
<< Code
*****************************************************


D'avance merci

1 réponse

Avatar
SAM

*****************************************************
Code >>
*****************************************************
$$("#formRecherche input").each (function (champ)
{
if (champ.type == "checkbox")
{
champ.addEvent ("click", function ()
{
$("formRecherche").fireEvent ("submit");
});
}
});
*****************************************************
<< Code
*****************************************************


Je ne connais pas Mootools mais :

- ne serait-ce pas :
$$("formRecherche input").each ( function () {...};

- de plus ici je pense que j'essaierais de simplifier

$$("#formRecherche input").each ( function ()
{
if (champ.type == "checkbox")
{
champ.addEvent ("click", function ()
{
this.form.submit();
});
}
});


Sinon en bête JS de nos grand-mères (et en "nommant" le form) :

var f = document.formRecherche;
// ou sans nommer le form (mais avec un id tt de même !) :
// var f = $('formRecherche');
if(f)
for (var i=0, L=f.length; i<L; i++) {
if(f[i].type == 'checkbox')
f[i].onclick = function(){ this.form.submit(); };
}


mais ... bon ... à savoir si ça va envoyer réellement le formulaire
(en Ajax et après éventuels contrôles) ?
sachant que dans la fonction de submit attachée je vois une histoire de
stopPropagation :

/**
* Prevent the submit event
*/
new Event(e).stop();

et qu'en outre, le truc submit(); , je me demande s'il ne by-passe pas
le onsubmit ?

donc peut-être :

var f = $('formRecherche');
if(f)
for (var i=0, L=f.length; i<L; i++) {
if(f[i].type == 'checkbox')
f[i].onclick = function(){
myAjax01 = this.form.send(
{
onComplete: function() {
formRechercheMaj (myAjax01);
}
}
);
};
}



--
sm