[JS] Met JS opgebouwd formulier geeft vreemde problemen.

Pagina: 1
Acties:

  • Michali
  • Registratie: Juli 2002
  • Laatst online: 22-03 18:12
Ik ben bezig met een web app waarin JS vrij intensief gebruikt wordt. Nu maak ik ook nu en dan gebruik van dialoog vensters, waarvan ik het resultaat vaak mbv. XMLHttpRequest naar de server stuur. Met een file upload is dat natuurlijk niet mogelijk, dus dan moet het formulier verzonden worden. Ik bouw de dialoog vensters puur met JS op. Nu heb ik enkele problemen, zowel in FF als in IE, alleen beide verschillend.

In FF wil het formulier in zijn geheel niet verzenden als het door JS is opgebouwd. Ik heb de HTML gecontroleerd, die lijkt ook correct te zijn. Als ik die HTML, direct verkregen door het als TextNode aan de body te appenden, in een apart bestand zet en die open, dan kan ik vreemd genoeg het formulier wel gewoon verzenden.

In IE verzend het formulier wel, maar weigert hij het bestand te uploaden. Ik krijg heb dus binnen als gewone $_POST var (in PHP) en niet in de $_FILES array. Lijkt erop dat het om die bug met enctype gaat, maar daar weet ik geen oplossing voor. Ook IE verzend het formulier normaal als het in een apart bestand geplaatst wordt.

Iemand enig idee wat er aan de hand is?

De betreffende HTML code:
HTML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<html>
<head>
<title></title>
<link href="css/dialog.css" rel="stylesheet" type="text/css">
</head>
<body>
<form method="post" enctype="multipart/form-data" action="action.php?action=upload_file">
<div>
<input value="3000000" name="MAX_FILE_SIZE" type="hidden">
<input value="1" name="directory" type="hidden">
<label for="file">Bestand:</label>
<input name="file" id="file" type="file">
<input value="Voeg toe" id="submit-button" name="submit-button" type="submit">
<input value="Annuleer" type="button">
</div>
</form>
</body>
</html>


Ik kan het natuurlijk oplossen door de HTML code wel gewoon altijd in een apart bestand te zetten, maar ik wil wel graag weten wat er nu aan de hand is. Ik zet hier liever geen JS code neer, omdat het om een behoorlijk stuk gaat, waarvan ik niet denk dat er veel fouten in zitten. Als jullie dat toch graag willen zien, dan post ik wel wat stukjes.

Ander probleem:

Ik probeer een stylesheet dynamisch toe te voegen. In Firefox wordt hij echter niet geladen, in IE wel. In de HTML code lijkt alles te kloppen.

// edit: Probleem met stylesheet is opgelost door een absoluut pad te gebruiken.

[ Voor 35% gewijzigd door Michali op 25-01-2006 17:59 ]

Noushka's Magnificent Dream | Unity


  • crisp
  • Registratie: Februari 2000
  • Laatst online: 18:59

crisp

Devver

Pixelated

In FF wil het formulier in zijn geheel niet verzenden als het door JS is opgebouwd.
heb je daar een voorbeeld van?

Intentionally left blank


  • Michali
  • Registratie: Juli 2002
  • Laatst online: 22-03 18:12
crisp schreef op woensdag 25 januari 2006 @ 20:41:
[...]
heb je daar een voorbeeld van?
Voer dit maar eens uit:
HTML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<script type="text/javascript">

var dialog = window.open('', '', 'width=500,height=500');
var doc = dialog.document;
var body = doc.body;

var form = doc.createElement('FORM');
form.action = 'test.html';
form.method = 'post';
body.appendChild(form);

var submit = doc.createElement('INPUT');
submit.type = 'submit';
form.appendChild(submit);

</script>

Ik heb het getest (Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8) Gecko/20051111 Firefox/1.5)

Als het formulier wordt opgebouwd in eigen window lijkt er niets aan de hand. Even checken of dit als bug is gereport. Ik ga voor dat probleem met IE ook wel even een test case maken.

// edit: Ik kan niet echt een bug vinden die dit volledig omschrijft. Mischien ga ik hem zo wel even melden.

Over IE:
HTML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<script type="text/javascript">

var dialog = window.open('', '', 'width=500,height=500');
var doc = dialog.document;
var body = doc.body;

var form = doc.createElement('FORM');
form.action = 'test.php';
form.method = 'post';
form.enctype = 'multipart/form-data';
body.appendChild(form);

var file = doc.createElement('INPUT');
file.type = 'file';
file.name = 'file';
form.appendChild(file);

var submit = doc.createElement('INPUT');
submit.type = 'submit';
form.appendChild(submit);

</script>


test.php:
PHP:
1
2
3
4
5
<?php

var_dump($_FILES);

?>


Output (altijd, met of zonder bestand):
code:
1
array(0) { }

[ Voor 37% gewijzigd door Michali op 25-01-2006 21:43 ]

Noushka's Magnificent Dream | Unity


  • crisp
  • Registratie: Februari 2000
  • Laatst online: 18:59

crisp

Devver

Pixelated

Lijken mij ook beide bugs; minder mooi maar wellicht een workaround: met document.write() of innerHTML werken...

Intentionally left blank