Accueil > > > AJAX - UN SEUL APPEL DE FONCTIONS POUR FAIRE DES LIENS ET SOUMETTRE DES FORMULAIRES
 AJAX - UN SEUL APPEL DE FONCTIONS POUR FAIRE DES LIENS ET SOUMETTRE DES FORMULAIRES
 Information sur la source
 Description
Bonjour, Voilà je suis débutant, et j'ai réalisé pour mon besoin deux fonctions Javascript qui me permettent par le biais d'Ajax de pouvoir aussi bien soumettre un formulaire que de réaliser des liens hypertextes. Le tout à partir d'un seul appel de fonction standard. Les paramètres (il n'y en a que 4) permettent de faire le reste. N'hésitez pas à critiquer, même si jusque là, ces fonctions ont très bien marché et je les mets à l'épreuve en développant mon propre CMS :p
 Source
- function getFormData(form)
- {
- var data1 = "";
- var form = document.getElementById(form);
- var elements = form.elements;
- for(var i=0; i<form.length; i++)
- {
- data1 += elements[i].name + "=" +escape(elements[i].value);
- if((i+1)<form.length)
- {
- data1+="&";
- }
- }
- return data1;
- }
-
- function ajax(fichier, div, method, form)
- {
- var xhr=null;
- var data="null";
-
- if(form!="null")
- {
- if(method=="GET")
- {
- data=form;
- method="POST";
- }
- else
- {
- data = getFormData(form);
- }
- }
- // détection du navigateur pour la création de l'objet XMLHttpRequest (soit l'acronyme xhr)
- if (window.XMLHttpRequest)
- {
- xhr = new XMLHttpRequest();
- }
- else if (window.ActiveXObject)
- {
- xhr = new ActiveXObject("Microsoft.XMLHTTP");
- }
- xhr.open( method, fichier, false);
- xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
- xhr.send(data);
-
- if (document.getElementById)
- {
- document.getElementById(div).innerHTML=xhr.responseText;
- }
- else
- {
- if (document.layers)
- {
- document.div.innerHTML=xhr.responseText;
- }
- else
- {
- document.all.div.innerHTML=xhr.responseText;
- }
- }
-
- }
-
- // Appels
- ajax("monfichier.php", "div_de_destination", "GET", null)
- ajax("monfichier.php", "div_de_destination", "POST", null)
- // ces appels permettent d'exécuter le script contenu dans monfichier.php et d'afficher le retour dans la div d'id div_de_destination, ici il n'y a pas de paramètre. Ce sont les appels de base, ils me servent notamment pour faire les liens hypertextes.
- ajax("monfichier.php", "div_de_destination", "GET", "c=2&d=4")
- // cet appel permet d'exécuter le script contenu dans monfichier.php et d'afficher le retour dans la div d'id div_de_destinatio, les données c=2 et d=4 sont transmises par la méthode POST.
- ajax("monfichier.php", "div_de_destination", "POST", "mon_formulaire")
- // cet appel permet d'exécuter le script contenu dans monfichier.php et d'afficher le retour dans la div d'id div_de_destinatio, les données du formulaire sont récupérées et mises en forme (également encodées avec la fonction escape, équivalent de l'url_encode de php) par la fonction getFormData puis sont transmises par la méthode POST.
function getFormData(form)
{
var data1 = "";
var form = document.getElementById(form);
var elements = form.elements;
for(var i=0; i<form.length; i++)
{
data1 += elements[i].name + "=" +escape(elements[i].value);
if((i+1)<form.length)
{
data1+="&";
}
}
return data1;
}
function ajax(fichier, div, method, form)
{
var xhr=null;
var data="null";
if(form!="null")
{
if(method=="GET")
{
data=form;
method="POST";
}
else
{
data = getFormData(form);
}
}
// détection du navigateur pour la création de l'objet XMLHttpRequest (soit l'acronyme xhr)
if (window.XMLHttpRequest)
{
xhr = new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
xhr.open( method, fichier, false);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send(data);
if (document.getElementById)
{
document.getElementById(div).innerHTML=xhr.responseText;
}
else
{
if (document.layers)
{
document.div.innerHTML=xhr.responseText;
}
else
{
document.all.div.innerHTML=xhr.responseText;
}
}
}
// Appels
ajax("monfichier.php", "div_de_destination", "GET", null)
ajax("monfichier.php", "div_de_destination", "POST", null)
// ces appels permettent d'exécuter le script contenu dans monfichier.php et d'afficher le retour dans la div d'id div_de_destination, ici il n'y a pas de paramètre. Ce sont les appels de base, ils me servent notamment pour faire les liens hypertextes.
ajax("monfichier.php", "div_de_destination", "GET", "c=2&d=4")
// cet appel permet d'exécuter le script contenu dans monfichier.php et d'afficher le retour dans la div d'id div_de_destinatio, les données c=2 et d=4 sont transmises par la méthode POST.
ajax("monfichier.php", "div_de_destination", "POST", "mon_formulaire")
// cet appel permet d'exécuter le script contenu dans monfichier.php et d'afficher le retour dans la div d'id div_de_destinatio, les données du formulaire sont récupérées et mises en forme (également encodées avec la fonction escape, équivalent de l'url_encode de php) par la fonction getFormData puis sont transmises par la méthode POST.
 Conclusion
Pour appeller la fonction de départ, il vous suffit de suivre les exemples en bas de la source.
Je suppose que ce n'est pas ce qui se fait de mieux, mais ça marche très bien jusqu'à maintenant.
 Historique
- 01 février 2007 11:15:52 :
- J'ai viré des commentaires inutiles
- 01 février 2007 11:18:44 :
- Corrections, j'avais involontairement supprimé une ligne de code essentielle :s
- 02 février 2007 15:59:43 :
- Amélioration de la portabilité, merci à Wizard512 pour son coup de main
 Sources de la même categorie
 Commentaires et avis
 Discussions en rapport avec ce code source dans le forum
Formulaire par methode POST via lien [ par zzzzzz ]
SalutJ'aimerai savoir comment on peu envoyer un formulaire par methode POST via un lien et non un boutonMerci d'avance :)
valider un formulaire avec un lien [ par perig ]
BonjoursJe cherche à faire un lien avec une transmission de variables mais par la méthode postAlors j'ai pensais à un formulaire utilisant la méthode
lien 2 effets [ par chaps29 ]
bonjour, je souhaiterais faire un lien avec une double action qui necessiterait du javascript je m'explique c'est pour modifier un element dans une b
Envoie de donner en POST sans formulaire [ par K0rr1gan ]
Bonjour, je cherche à envoyer des données en post vers une page php avec du javascript mais SANS passer par un formulaire et un submit. Y
probleme formulaire [ par ao2208 ]
BONJOUR, Voici mon probleme : Le bouton "envoyer" recharge la page panier.php donc les valeurs ds les text area disparaissent auriez v
opener et POST [ par kangun ]
Bonjour tlm!!je suis à al recherche (désespérément) d'une solution pour envoyer un formulaire à la page parent (le opener) qui l'a ouvert, pour traite
Récupérer valeur post ou get [ par Flyer ]
Comment je peut faire pour récuprer les valeurs des variables transmisent à une autre page par l'intermédiaire d'un post ou un get ?Ex:Page 1 envoie à
empecher clic multiple sur un lien pour lea soumission d'un formulaire [ par jesaispo ]
Bonjour,Dans le cadre de mon travail je suis confronter a un probleme :je dois empecher des clic multiples sur un lien qui envoie un formulaire.proble
Methode POST - Poster une variable sans validation du formulaire [ par ultimatePuta ]
Bonjour à tous,J'aimerai savoir si il est possible de "POSTER" une variable javascript sans valider un formulaire. En effet je dois récup
Executer un script a partir d'un lien [ par raven44 ]
J'ai un lien sur un de mes formulaire et de ce lien, je voudrais qu'il m'execute un script situé sur un autre formulaire !! Que dois-je mettre dans l
|
Derniers Blogs
 [DIVERS] SUIVRE VOS SéRIES PRéFéRéS SUR LA TOILE[DIVERS] SUIVRE VOS SéRIES PRéFéRéS SUR LA TOILE par orion
Comme de nombreux geek, je suis un grand amateur de série TV et je rate régulièrement des épisodes de mes séries préférés. Une solution s'offre à vous avec ce merveilleux site : Tv Gorge - www.tvgorge.com Moteur de recherche à l'appui, vous pouvez ...
Cliquez pour lire la suite de l'article par orion TECHDAYS PARIS 2010 : LA BI DANS SHAREPOINT 2010TECHDAYS PARIS 2010 : LA BI DANS SHAREPOINT 2010 par ROMELARD Fabrice
Animé par: Vincent Bellet et Baptiste Giraudier La BI dans SharePoint 2010, Les nouveaux services d'application dans SP2010 et SQL Server Reporting services 2008 R2. La BI dans SharePoint est généralisée pour tous afin de permettre à tous les coll...
Cliquez pour lire la suite de l'article par ROMELARD Fabrice TECHDAYS PARIS 2010 : PLAN DE MIGRATION VERS SHAREPOINT 2010TECHDAYS PARIS 2010 : PLAN DE MIGRATION VERS SHAREPOINT 2010 par ROMELARD Fabrice
Animé par: Arnault Nouvel et Antoine Dongois Le processus à prendre : Apprendre (découvrir la plateforme) Préparer (documenter l'historique et choisir la méthode de MAJ) Test (Test de MAJ) Implémenter (Effectuer la MAJ) Valid...
Cliquez pour lire la suite de l'article par ROMELARD Fabrice TECHDAYS PARIS 2010 : LA PLEINIèRE DU SECOND JOURTECHDAYS PARIS 2010 : LA PLEINIèRE DU SECOND JOUR par ROMELARD Fabrice
Après un retour sur l'histoire des TechDays de Paris et le fait que ce soit le plus gros event MS au monde (du fait de sa gratuité), le président de MS France (Eric Boustoullier) a fait une présentation de la vision Microsoft pour les années à venir...
Cliquez pour lire la suite de l'article par ROMELARD Fabrice
Logiciels
 DB-MAIN (9.1.0)DB-MAIN (9.1.0)DB-MAIN is a data-modeling and data-architecture tool. It is designed to help developers and anal... Cliquez pour télécharger DB-MAIN Xilisoft DPG Convertisseur (5.1.37.0120)XILISOFT DPG CONVERTISSEUR (5.1.37.0120)Xilisoft DPG Convertisseur offre aux fans de Nintendo DS une bonne solution leur permettant de dé... Cliquez pour télécharger Xilisoft DPG Convertisseur GraphicsGale (2.01.01)GRAPHICSGALE (2.01.01)GraphicsGale est un logiciel de PixelArt avec de nombreuse fonctionnalités permettant de réalisé ... Cliquez pour télécharger GraphicsGale Architecte 3D (Platinum 2010)ARCHITECTE 3D (PLATINUM 2010)Architecte 3D Platinium vous permet de concevoir facilement les plans votre future maison, de l'é... Cliquez pour télécharger Architecte 3D TeamViewer 5 (TeamViewer 5)TEAMVIEWER 5 (TEAMVIEWER 5)Dépanner un ami,expliquer une manipulation devient un jeu d'enfant.
Prise en main d'un autre ord... Cliquez pour télécharger TeamViewer 5
|