Probleem Ajax contactformulier in MSIE

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Full Stack Developer Industriële Automatiseri

Raster levert slimme industriële automatiseringsoplossingen aan nationale en internationale opdrachtgevers voor wie procesveiligheid van groot belang is. We zijn sterk in spraakmakende one-off projecten in de productie- en procesautomatisering waarbij extreme engineering een terugkerend thema is. Daarbij kun je denken aan: Het veilig en duurzaam ontwerpen, plaatsen én weer opruimen van olie- en gas- productieplatformen De transformatie van de olie- en gasmarkt naar windenergie op zee Het oplossen van lokale parkeerproblematiek in dichtbevolkte steden Het cyber secure maken van kritische industriële productieomgevingen Het op afstand veilig produceren door onbemande platformen op de Noordzee Het succesvol lanceren van satellieten in de

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

07/12/2021 22:48:57
 
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.