13
Jan
09

AJAX Formular mit Anker in der URL versenden

Ein normales HTML Formular kann mit Prototype JS sehr einfach mittels AJAX versendet werden. Dazu wird ganz einfach ein normales Formular erstellt:


<form id="myform" method="post" action="/controller">
   <input type="text" name="firstname" />
   <input type="text" name="lastname" />
   ...
   <input type="button" onclick="sendForm();" value="Versenden"/>
</form>

Nun kann mit relativ wenig Code das Formular versendet werden:


function sendForm() {
   $('myform').request({
      onSuccess: function(transport) {
         ...
      },
      onFailure: function(transport) {
         ...
      }
 });
}

Genau das wollte ich heute mit einem Formular in Radiant CMS machen, welcher ein Mail mit der Mailer-Erweiterung versendet. Damit das ganze noch etwas eleganter daherkommt, wird das Formular in einem Fenster mit Prototype Window dargestellt. Das funktioniert auch wunderbar, doch der obligate Test mit dem verstaubten Internet Explorer war leider einmal mehr nicht erfolgreich. Der Explorer konnte das Fomular nicht fehlerfrei versenden.

Nach einer Analyse der HTTP Anfragen kam zu Tage, dass durch die Darstellung des Formulares in einer Dialogbox (dessen Inhalt selber wiederum mit AJAX geladen wird), die URL zum Mailer-Kontroller einen HTML Anker enthielt:


/pages/25/mailer#mail

Irgendwie kommt der IE mit einem Anker in der Zielurl ganz und gar nicht klar. Nach ein wenig herumexperimentieren blieb mir nichts anderes übrig, als die URL selber aus dem Formular zu holen, den Anker daraus zu entfernen und erst dann das Formular zu versenden:


var url = $('myform').action;
var anchor = url.indexOf('#');
if (anchor != -1) {
   url = url.substring(0, anchor);
}
new Ajax.Request(url , {
   method: 'post',
   parameters: Form.serialize('myform'),
   onSuccess: function(transport) {
      ...
   },
   onFailure: function(transport) {
      ...
   }
});

Wieder einmal mehr wird durch den Explorer ein Stück eleganter Code zu einem komischen Rumgebastel. Internet Explorer - ohne dich würde die Webentwicklung wirklich Spass machen!





September 2010
M D M D F S S
« Jun    
 12345
6789101112
13141516171819
20212223242526
27282930  

Werbung


Buttonitis