After a deferred action after clicking on a form

I have the following code to open a form in a popup. I want a notification popup to appear after 1250 milliseconds after clicking Submit. This currently does not work as the page is redirected to the result of the form submit.

<?php
$blah = "Well"; $test = "Done";
echo '<script type="text/javascript" src="fetchlayers.js"></script>';
$formcode = "<form action=\"process.php\" method=\"post\" enctype=\"multipart/form-data \"><label for=\"file\">Filename:</label><input type=\"file\" name=\"file\" id=\"file\"/> <br /><input type=\"submit\" name=\"submit\" value=\"Submit\" onclick=\"setTimeout(function() { alert('$blah'); },1250);\" /></form>";


echo "<h1>hello</h1>
<div id='form'>
<a href='#' onclick=\"createpopup('" . htmlentities($formcode) . "'); return false;\">
click here</a>
</div>";

      

What would be the best way to get the pending action after the form is submitted?

0


a source to share


3 answers


try using document.form.submit () inside a timer callback instead of using a submit button



+1


a source


If I understand correctly, you want to open a popup that contains the form, then display an alert box after the form is submitted?



Try using window.opener in your setTimeout () callback. This way you can tell the original window to display an alert box - it doesn't matter if your popup page is redirected.

0


a source


What would be the best way to get the pending action after the form is submitted?

You simply cannot perform these two operations in that order from the same window. Once the form is submitted, you effectively leave the state of the current page and request a new resource.

From your popup, you will get a link to the parent window. When the user wants to submit the form, you can call some JavaScript to perform the pending action on the parent window and then allow the form to be submitted in the popup.

EDIT: Based on your comment, here's a way to communicate between windows; you can have a simple setup:

<!-- parent.html -->
<input type="button" onclick="doOpenChild();" value="Spawn Child Window" />

<script type="text/javascript">
  function doOpenChild() {
    window.open(
      "child.html",
      "child"
    );
  }

  function doSomething() {
    setTimeout(
      function(){
        alert(fileINeedToCheck);
      },
      2000
    );
  }

  // Set variable for child to update...
  window.fileINeedToCheck = "unset";
</script>

      

Create a popup with something like this:

<!-- child.html -->
<form action="/someaction.php" name="childForm" onsubmit="communicateWithParent(this);">
  <input type="text" name="fileName" value="100" />
  <input type="submit" value="Submit" />
</form>

<script type="text/javascript">
  function communicateWithParent(aForm) {
    if(window.opener) {
      if(window.opener.fileINeedToCheck) {
        window.opener.fileINeedToCheck = aForm.fileName.value;

        // You can also call functions from the parent window...
        window.opener.doSomething();
      }
    }
  }
</script>

      

The variable of the parent window can be updated with values ​​from the child window.

0


a source







All Articles