Ajax form et attribut action

Version imprimable

Bonjour,

J'ai un problème que je n'arrive pas à résoudre. Je dois récupérer l'action dans un form, le réécrire puis soumettre le formulaire en ajax.

Actuellement j'ai plusieurs pistes :

Methode 1

Code:

1
2
3
4
5
6
7
8
9
10
11
	$(".btnmain").click(function(){
 
		$('form').attr("action", function(){
		this.action = $('form').attr('action');
		this.action = this.action.replace(/\/$/, "");
		this.action = this.action.replace("fobb/", "");
		this.action = this.action.replace(".php", "");
 
			});
		//return false;
	});

Le comportement fonctionne mais l'ajax n'est pas implémenté.

Methode 2
Mais ceci ne marche pas -> (ajax non lançé)

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
	$(".btnmain").click(function(){
 
		$('form').attr("action", function(){
		this.action = $('form').attr('action');
		this.action = this.action.replace(/\/$/, "");
		this.action = this.action.replace("fobb/", "");
		this.action = this.action.replace(".php", "");
 
		$.post(this.action ,$('form').serialize(), function(data){
			$('#layout').html(data);
 
		  });
 
			});
		return false;
	});

Methode 3
ou encore, sans succes (ajax lançé mais le php retourne de mauvais résultat) :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
	$(".btnmain").click(function(){
		var myaction = $('form').attr('action');
		myaction = myaction.replace(/\/$/, "");
		myaction = myaction.replace("fobb/", "");
		myaction = myaction.replace(".php", "");
		$.post(myaction,$('form').serialize(), function(data){
			$('#layout').html(data);
 
			});
 
		return false;
 
	});
});

Comment pourrais je fusionner la Méthode 1 et la méthode 3 ?

31/08/2011, 14h27
SpaceFrog

c'est quoi ton .btnmain ?

on peut voir le html du form?

le .btmain c'est la class du bouton submit. Je ne peux pas toucher le html donc impossible de le modifier, il faut exploiter ce que l'on à ^^

Le form est trés gros donc si je fais un copié collé ça vas pas le faire, en voici donc juste un bout :

Code:

1
2
3
4
5
6
7
8
9
10
11
<form enctype="multipart/form-data" name="postform" method="post" action="fobb/posting.php?mode=post&amp;f=2">
 
 
<input type="hidden" value="1314786162" name="lastclick">
<input type="submit" value="Prévisualisation" name="preview" tabindex="10" class="btnlite">
<input type="submit" value="Envoyer" name="post" tabindex="11" accesskey="s" class="btnmain">
<input type="submit" value="Annuler" name="cancel" tabindex="14" accesskey="c" class="btnlite">
<input type="hidden" value="1314786162" name="creation_time">
<input type="hidden" value="f20af6c5166236137100adead8c5d6e3344323fd" name="form_token">
 
	</form>

31/08/2011, 15h28
SpaceFrog

je en comprends pas la liaison que tu fais au niveua du fait que php ne retourne pas le bon resultat ? c'est independant de javascript ...

Si, car dans le cas présent le php attendait la valeur post "Envoyer" que traite le bouton submit dans un comportement normal. Hors dans la méthode que j'essayais, elle était extrapolé par le javascript donc le traitement php ne se faisait pas ^^

J'ai devais donc rajouter un input hidden "post" value "envoyer" mais comme je ne peux modifier le html je l'ais rajouter avec le javascript. Ce qui fonctionne, mais si y'a une méthode moins lourde je suis preneur.
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 $(".btnmain").click(function(){ var myaction = $('form').attr('action'); myaction = myaction.replace(/\/$/, ""); myaction = myaction.replace("fobb/", ""); myaction = myaction.replace(".php", ""); $.post(myaction, wrapFormValues('form'), function(data){ $('#layout').html(data); }); return false; }); }); function wrapFormValues(form) { form = $(form).serializeArray(); var dataArray = new Object(); for( index in form) { if(form[index].value) { dataArray[form[index].name] = form[index].value; } } dataArray['post'] = 'Envoyer'; return dataArray; }