[Javascript]Form op pagina submit niet vanuit iframe

[Cyphax]

Ik heb een pagina index.php gemaakt (PHP) die een lijst samenstelt van bepaalde bestanden in een directory, en die in een Javascript array plaatst. Clientside wordt er een <select> samengesteld met de inhoud van die array. Dat werkt allemaal uitstekend, de array wordt netjes gevuld met path/bestandsnaam. Het form submit naar processfile.php die er wat mee doet, maar het target van dat form is een iframe in index.php omdat ik a) niet wil dat er gerefreshed wordt, en b) omdat ik de output wil zien zonder popups en dergelijke. Niet willen refreshen is omdat er uiteindelijk duizenden bestanden worden bewerkt, en de reden dat ik met die listbox werk is omdat het te lang duurt om in 1 run duizenden bestanden te bewerken (dan timed het script uit en het zal sowieso een tijdje duren voordat ie klaar is).
Nou had ik dus bedacht dat de pagina als volgt werkt:
- index.php wordt geladen en de bestanden worden in de array gezet - werkt
- de listbox wordt met Javascript gemaakt aan de hand van de array - werkt
- er staat een button "process" met als onclick de volgende code:

JavaScript:

      function processFile(listboxID, formID)
      {
        var ListBox = document.getElementById('filelist');
        var FileForm = document.getElementById('processform');
        ListBox.selectedIndex = nextFile;
        nextFile++;
        FileForm.submit();
      }

Wat ie dus doet is de volgende <option> selecteren aan de hand van globale var nextFile die in het begin op 0 staat.
- als ik op submit druk wordt het form gesubmit en in processfile.php wordt de bestandsnaam nu en dat gaat goed; ik zie de bestandsnaam netjes in het iframe.
- onderaan processfile.php staat dit:

JavaScript:

<script type="text/javascript">
  parent.top.processFile();
</script>

waarmee ik dus in index.php de Javascriptfunctie weer aan wil roepen, en zo dus recursief en wel de hele lijst door wil.
MAAR dit werkt niet helemaal. Wat ie doet als ik zelf op de "Process" knop druk, is het form submitten door de functie processFile(), en vervolgens die functie opnieuw aanroepen vanuit het iframe. Het probleem is dat ie ondanks dat de functie aangeroepen wordt, het form niet de 2e keer gesubmit wordt. Wel zie ik het geselecteerde item verspringen in de listbox. Ik kan ook gewoon opnieuw op de knop drukken, dan submit ie wel.

Mijn vraag is nu: waarom submit ie vanuit het iframe keer niet? Is dit een beveiligingsissue waar ik tegenaan loop (kan ik me iets bij voorstellen)? Kan ik dit beter iets anders aanpakken, en zo ja; hoe zou jij dat doen, met in je achterhoofd de eisen (niet index.php refreshen, wel output van processfile.php op de pagina)?
('k heb hier en met google rondgezocht maar echt vergelijkbare problemen kom ik niet tegen)
Heb ik hier nog de HTML met het form, waarschijnlijk niet zo relevant.

code:

  <form id="processform" action="processfile.php" method="get" target="processframe">
  <select id="filelist" name="filename" onfocus="buildFileListBox(document.getElementById('filelist'));">
  <option id="firstoption">Building tree...</option>
  </select>
  <input type="button" value="process" onclick="processFile();">
  </form>

[André]

Komt het misschien door de aanroep, kun je daar eens parent.processFile(); van maken? Ik kan me niet voorstellen dat het een security issue is omdat je wel bij de rest van het formulier kunt komen.

Je kunt naturlijk ook proberen alleen vanuit de parent te werken, dan hou je gewoon in de gaten wanneer het iframe klaar is met laden en dan direct weer het formulier submitten. Dit kun je bijvoorbeeld doen door om de paar (100) ms te checken of de iframe geladen is of door het iframe een functie aan te laten roepen.

[ Voor 86% gewijzigd door André op 12-06-2005 13:39 ]

[crisp]

Je moet een kleine timeout inbouwen tussen het ophogen van je selectedIndex en het submitten van je form:

JavaScript:

var nextFile = 0;
function processFile(listboxID, formID)
{
    var ListBox = document.getElementById('filelist');
    if (nextFile < ListBox.options.length)
    {
        ListBox.selectedIndex = nextFile;
        nextFile++;
        setTimeout('doSubmit()', 10);
    }
}

function doSubmit()
{
    var FileForm = document.getElementById('processform');
    FileForm.submit();
}

[Cyphax]

André schreef op zondag 12 juni 2005 @ 13:30:
Komt het misschien door de aanroep, kun je daar eens parent.processFile(); van maken? Ik kan me niet voorstellen dat het een security issue is omdat je wel bij de rest van het formulier kunt komen.

Je kunt naturlijk ook proberen alleen vanuit de parent te werken, dan hou je gewoon in de gaten wanneer het iframe klaar is met laden en dan direct weer het formulier submitten. Dit kun je bijvoorbeeld doen door om de paar (100) ms te checken of de iframe geladen is of door het iframe een functie aan te laten roepen.

Als het iframe uitgeladen is (hangt van PHP af) roept ie de functie aan, is dat ongeveer hetzelfde als wat jij bedoelt? Omdat het uiteindelijk vanuit de parent geregeld is al?

crisp schreef op zondag 12 juni 2005 @ 13:39:
Je moet een kleine timeout inbouwen tussen het ophogen van je selectedIndex en het submitten van je form:

JavaScript:

...

Dit werkte BIJNA goed
Hij loopt zo inderdaad door de hele lijst, maar dan gebeurt er nog niets met de bestanden (mp3's). Nu heb ik een functie toegevoegd die de ID3-tag uitleest van elk bestand, en op gegeven moment hield ie ermee op. Stopte gewoon stomweg, zonder foutmelding of wat voor feedback dan ook.
Nu heb ik even doorgespeeld met die timeout en in processFile staat nu ook een setTimeout terug naar de parent van 100ms, en in index.php is de timeout ook 100ms ipv de 10 die je suggereerde. Nu werkt ie met 146 bestanden prima (duurt zo'n 2 minuten). Tijd om te testen met bijna 1000 files.
In elk geval vast bedankt voor deze suggesties, maar wat ik me een beetje afvraag is; waarom heeft ie die delay nodig?
[edit] 920 bestanden: geen probleem.

[André]

De delay is waarschijnlijk nodig omdat het formulier nog aangepast word door je ListBox.selectedIndex = nextFile; en dan submit hij niet. En door die kleien vertraging is die bewerking al gedaan.

[crisp]

Hij submit wel, maar met de oude waarde; vervolgens wordt de pagina in het iframe gewoon uit de cache van je browser gehaald, en op 1 of andere manier wordt dan de JS daarin niet meer uitgevoerd (denk ik)
Als je alle problemen wilt uitsluiten zou je de functie in de iframe-pagina onload kunnen uitvoeren.

[ Voor 42% gewijzigd door crisp op 12-06-2005 17:05 ]

[Cyphax]

crisp schreef op zondag 12 juni 2005 @ 17:04:
Hij submit wel, maar met de oude waarde; vervolgens wordt de pagina in het iframe gewoon uit de cache van je browser gehaald, en op 1 of andere manier wordt dan de JS daarin niet meer uitgevoerd (denk ik)

Euh, logisch...?
Die onload is een goede suggestie, 's kijken of dat ook goed werkt want da's wel iets netter denk ik, maar hij werkt prima met 2500 bestanden zelfs dus ik denk dat het sowieso goed werkt al.