Probleem Ajax contactformulier in MSIE

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Mobile Developer in Oost-Nederland (Android en/of

Bedrijfsomschrijving Een unieke kans voor Mobile Developers in Oost-Nederland. Deze prachtige organisatie is namelijk opzoek naar een Mobile Developer. Mobile Development en Ops Engineering gaan hand in hand bij deze organisatie dat een hoog verantwoordelijkheidsgevoel draagt. Als organisatie ontwikkelt zij dan ook veelal mobiele applicaties ter inspiratie en ondersteuning van belangrijke sectoren in Nederland. Met het technische team van gepassioneerde developers en engineers voeren ze dagelijks veelal diverse, inspirerende en complexe werkzaamheden uit. Door gebruik van innovatieve software en de nieuwste platformen binnen de sector is deze klant dan ook zeker als vooruitstrevend te betitelen waar zijn enorm veel waarde

Bekijk vacature »

Rene Wennekes

Rene Wennekes

02/11/2010 13:09:48
Quote Anchor link
Ik krijg met mijn Ajax-contactformulier een foutmelding.

De website van (url) kan niet worden geopend.
De bewerking is afgebroken.

Onder alle andere browser werkt het correct.

Wanneer treed het probleem op?

In de fase toen alles met alerts werkte was er geen probleem.

Toen had ik besloten om de zaak te verfraaien en verborgen <div>'s zichtbaar te latem maken in plaats van de standaard alert vensters ( alert() ).

===== code ======
<code>

function handleStateChange() {
if (xmlHttp.readyState == 4) {
if (xmlHttp.status == 200) {
//alert(xmlHttp.responseText); // De uitvoer van contactsendmail.php zou hier moeten verschijnen.
if (xmlHttp.responseText == "Your message is succesfully send.") {
//document.getElementById('contactform').style.display = 'none'
document.getElementById('contactsenderror').style.display = 'none'
document.getElementById('contactconfirm').style.display = 'block'
document.getElementById('blackground').style.display = 'block'
//document.getElementById('contactform').reset();
}
if (xmlHttp.responseText == "Something went wrong.") {
//document.getElementById('contactform').style.display = 'none'
document.getElementById('contactconfirm').style.display = 'none'
document.getElementById('contactsenderror').style.display = 'block'
document.getElementById('blackground').style.display = 'block'
}
}
}
} // End of function handleStateChange()

</code>
======================================

Zodra in IE (ook 8!) de <div> gaat verschijnen d.m.v. javascript en style wordt blocked, verschijnt de foutmelding:

De website van (url) kan niet worden geopend.
De bewerking is afgebroken.

Uiteraard (hoe kan het ook anders) geven de overige browsers geen problemen.
Iemand ?????
Gewijzigd op 02/11/2010 14:02:18 door Rene Wennekes
 
PHP hulp

PHP hulp

20/01/2021 04:49:18
 
Jasper hoi

jasper hoi

02/11/2010 14:07:30
Quote Anchor link
code kan je tussen de code tags zetten: ['code'] en ['/code'] (zonder de ' natuurlijk)
En heb je misschien een live voorbeeld van wat er fout gaat, is met een ajax probleem wel zo makkelijk.

-edit-
Kijk ook is naar het ajax deel van jquery, scheelt echt ongelofelijk veel tijd
Gewijzigd op 02/11/2010 14:08:37 door jasper hoi
 
Rene Wennekes

Rene Wennekes

02/11/2010 14:24:17
Quote Anchor link
Heb al iets op internet gevonden

For example, this problem may occur if a DIV element is a child container in a BODY element, and a SCRIPT block in the DIV element tries to modify the BODY element that is a parent container for the DIV element. This is a bug in the Internet Explorer parser.

En dit zou best kunnen (damn Microschoft).

Gaat om deze
Code (php)
PHP script in nieuw venster Selecteer het PHP script
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
<div id='blackground' style='position: absolute; top: 160px; left: 50%; width:360px; height:400px; margin-left: -180px; padding: 20px; border: 1px solid gray; text-align: center; display: none; cursor:hand; cursor:pointer; background: #000; opacity: 0.80; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);'>
</div>

<div id="contactconfirm" style="position: absolute; top: 160px; left: 50%; width:360px; height:400px; margin-left: -180px; padding: 20px; border: 1px solid gray; text-align: center; display: none; cursor:hand; cursor:pointer;" onclick="document.getElementById('blackground').style.display = 'none'; document.getElementById('contactconfirm').style.display = 'none'; document.forms[0].reset();">
  <p>
  <img src="ok.png" alt="" style="float: left; margin: 0px 20px 20px 0px;" />
  <span class="redmarker">The form is correctly sended.</span><br />
  <br />
  With kind regards.<br />
  </p>
</div>

<div id="contactsenderror" style="position: absolute; top: 160px; left: 50%; width:360px; height:400px; margin-left: -180px; padding: 20px; border: 1px solid gray; text-align: center; display: none; cursor:hand; cursor:pointer;" onclick="document.getElementById('blackground').style.display = 'none'; document.getElementById('contactsenderror').style.display = 'none';">
  <p>
  <img src="error.png" alt="" style="float: left; margin: 0px 20px 20px 0px;" />
  <span class="redmarker">An error occured while sending the form!!!</span><br />
  </p>
</div>

<div id="sendformcheck" style="position: absolute; top: 160px; left: 50%; width:360px; height:400px; margin-left: -180px; padding: 20px; border: 1px solid gray; text-align: center; display: none; cursor:hand; cursor:pointer;" onclick="document.getElementById('blackground').style.display = 'none'; document.getElementById('sendformcheck').style.display = 'none';">
  <p>
  <img src="warning.png" alt="" style="float: left; margin: 0px 20px 20px 0px;" />
  <span id="sendformcheckmessage" class="redmarker"></span><br />
  </p>
</div>


ik heb ze al op hetzelfde niveau gezet als het formulier maar werkt ook niet.

oh ja, hier ff mijn testpagina

http://www.wennekes.info/renewennekes/contact.php
Gewijzigd op 02/11/2010 14:26:13 door Rene Wennekes
 
Han eev

Han eev

02/11/2010 14:31:09
Quote Anchor link
Ehm, korte opmerking.
Let op ';' (ook bij javascript, vooral IE kan daar nog al eens op zeuren)
verder waar wordt xmlHttp vandaan gehaald? scope?
 
Rene Wennekes

Rene Wennekes

02/11/2010 14:38:05
Quote Anchor link
Nou hier wat code om te laten zien in welke postitie t.o.v. <body> het script staat.
Volgens mij ligt het niet aan de CODE of de xmlHttp, die werkt correct.

Het schijnt iets lulligs van ie te zijn over de plaats van het te style object t.o.v. de plaats van het script (child/parent).
Helaas werkte het plaatsen van de <div>'s naast het script onder de <body> tag ook niet.

Code (php)
PHP script in nieuw venster Selecteer het PHP script
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
<body>
<script type="text/javascript" src="md5.js"></script>
<script type="text/javascript">
<!-- Begin
var xmlHttp;
function createXMLHttpRequest () {
  if (window.ActiveXObject) {xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");}
  else if(window.XMLHttpRequest) {xmlHttp = new XMLHttpRequest();}
  } // End of function createXMLHttpRequest ()

function handleStateChange() {
  if (xmlHttp.readyState == 4) {
    if (xmlHttp.status == 200) {
      //alert(xmlHttp.responseText); // De uitvoer van contactsendmail.php zou hier moeten verschijnen.
      if (xmlHttp.responseText == "Your message is succesfully send.") {
        //document.getElementById('contactform').style.display = 'none'
        document.getElementById('contactsenderror').style.display = 'none'
        document.getElementById('blackground').style.display = 'block'
        document.getElementById('contactconfirm').style.display = 'block'
        //document.getElementById('contactform').reset();
        }
      if (xmlHttp.responseText == "Something went wrong.") {
        //document.getElementById('contactform').style.display = 'none'
        document.getElementById('contactconfirm').style.display = 'none'
        document.getElementById('blackground').style.display = 'block'
        document.getElementById('contactsenderror').style.display = 'block'
        }
      }
    }
  } // End of function handleStateChange()


Zat te denken of dit van toepassing was

http://forum.dutchjoomla.org/archive/index.php/t-53180.html

Maar het probleem is dat het ook met IE8 is.

Of het is een probleem met e.o.a. plugin i.c.m. flash of zo.
Ga nu eens ff testen met de flash eruit gecommenteerd.
===update === nee, ligt ook niet aan de flash.
Gewijzigd op 02/11/2010 14:45:23 door Rene Wennekes
 
Jasper hoi

jasper hoi

02/11/2010 14:47:48
Quote Anchor link
en als je de javascript dingen in de head of helemaal onderaan de pagina zet?
 
Rene Wennekes

Rene Wennekes

02/11/2010 14:58:29
Quote Anchor link
Nope, buiten de <body> werkt het ook niet.

heb ook al regel 17 en 24 gecommenteerd, werkt ook niet.

==== Update =====

heb de <div>'s van de hidden meldvensters aangepast.

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<div id='blackground' style='position: absolute; top: 160px; left: 50%; width:360px; height:400px; margin-left: -180px; padding: 20px; border: 1px solid gray; text-align: center; display: none; cursor:hand; cursor:pointer; background: #000; opacity: 0.80; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);'>
</div>

<div id="contactconfirm" style="position: absolute; top: 160px; left: 50%; width:360px; height:400px; margin-left: -180px; padding: 20px; border: 1px solid gray; text-align: center; display: none; cursor:hand; cursor:pointer;" onclick="document.getElementById('blackground').style.display = 'none'; document.getElementById('contactconfirm').style.display = 'none'; document.forms[0].reset();">
  <img src="ok.png" alt="" style="float: left; margin: 0px 20px 20px 0px;" />
  <div style="width: 160px; float: right;">The form is correctly sended.</div>
</div>

<div id="contactsenderror" style="position: absolute; top: 160px; left: 50%; width:360px; height:400px; margin-left: -180px; padding: 20px; border: 1px solid gray; text-align: center; display: none; cursor:hand; cursor:pointer;" onclick="document.getElementById('blackground').style.display = 'none'; document.getElementById('contactsenderror').style.display = 'none';">
  <img src="error.png" alt="" style="float: left; margin: 0px 20px 20px 0px;" />
  <div style="width: 160px; float: right;">An error occured while sending the form!!!</div>
</div>

<div id="sendformcheck" style="position: absolute; top: 160px; left: 50%; width:360px; height:400px; margin-left: -180px; padding: 20px; border: 1px solid gray; text-align: center; display: none; cursor:hand; cursor:pointer;" onclick="document.getElementById('blackground').style.display = 'none'; document.getElementById('sendformcheck').style.display = 'none';">
  <img src="warning.png" alt="" style="float: left; margin: 0px 20px 20px 0px;" />
  <div id="sendformcheckmessage" style="width: 160px; float: right;"></div>
</div>


Nu werkt de warning bij verkeerd invullen goed.
Alleen bij de bevestiging na het verzenden krijg ik nog de foutmelding
Gewijzigd op 02/11/2010 23:31:52 door Rene Wennekes
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.