?
Solved

Javascript timing?/caching? problem

Posted on 2003-03-28
3
Medium Priority
?
160 Views
Last Modified: 2010-04-06
I'm having an issue with what appears to be a caching or timing issue with javascript.

Essentially I have a form page - in the head is the following function:

<script language="Javascript">
<!--
function mailThis()
{
        alert("debug");
     if (document.getElementById("eAddress").value.length < 8){
          alert("Please enter a valid email address.");
          return false;
          }
     document.getElementById("htmlString").value = document.getElementById("mailpart").innerHTML;
        document.getElementById('inv').submit();
}
//-->
</script>

mailPart is a div surrounding some of the HTML in the body of the page, while htmlString is a hidden input in a form, the declaration of which looks like this:

<form action="email.asp" id ="inv" method="POST">

<input type="hidden" id="htmlString" name="htmlString" value="">
<INPUT TYPE=button onClick="mailThis()" VALUE="Email Results">
</p>
</form>

So the idea is pretty obvious - on clicking the button I want the function to transfer the div contents to the hidden input and submit the form to email.asp.

The problem:
*Most* of the time it works, but sometimes it seems as if some of the javascript is selectively not being processed.  There is no pure submit button for the form - the only way to get to email.asp is to run the mailThis() function and submit programatically - yet sometimes when I click the button I end up at email.asp without even seeing the alert box - in these cases, the div contents have also not been copied to the hidden input...  When this happens it usually does so the first time I click the "Email Results" button.  If I use the back button on the browser and click it again I get the alert and the content copy.
0
Comment
Question by:baal32
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
3 Comments
 

Author Comment

by:baal32
ID: 8226580
I should also note that I'm not really looking for cross-browser compataibility or better ways to implement the same functionality.  Im only looking for an answer to my specific problem.
0
 
LVL 5

Accepted Solution

by:
gator4life earned 160 total points
ID: 8232160
Instead of using an <input type="button"> element to submit the form through script, you should use an <input type="submit"> element and call the mailThis() function from within the onsubmit event handler of the form.  If you are experiencing a timing problem, then the onsubmit event handler of the form element is the absolute best way to ensure that dynamic functionality you want occurs right before the form gets submitted, especially since you have validation code within the mailThis() function (i.e. validation code should always be handled through the onsubmit event handler of the form).  Here is how I would set this up:

<script type="text/javascript">
<!--
     function mailThis() {

          if (document.getElementById('eAddress').value.length < 8) {

               window.alert('Please enter a valid email address.');
               return(false);
          }

          document.getElementById('htmlString').value = document.getElementById('mailpart').innerHTML;
          return(true);
     }
//-->
</script>

<form action="email.asp" id="inv" method="post" onsubmit="return(mailThis())">
     .....
     <input type="hidden" id="htmlString" name="htmlString">
     <input type="submit" id="submit" name="submit" value="Email Results">
     .....
</form>

Let me know if you still run into problems if you try this out.

gator4life
(chomp, chomp)
0
 

Author Comment

by:baal32
ID: 8263639
Hi Gator

Its taking a little while because I'm still trying to reproduce the errors so I can apply your fix.  In any case I was wondering i f you might be able to explain a possible scenario (event timeline) that might account for my problems.  I still cant get over the fact that in my original code the *only* way for the form to be submitted was by calling the javascript function yet somehow it managed to submit without processing the function (the alert, the copy, etc.)  It would be my understanding that in the code no operation could be started until the previous one had completed ie.
   document.getElementById('inv').submit(); could only occur after
 document.getElementById("htmlString").value = document.getElementById("mailpart").innerHTML;
had finished its operation.
I'm raising the points for this question 10 to account for the explanation.
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

It's sometimes a bit tricky to use date functions in Oracle BPEL. I'll explain quickly how you can add N days to the current date. In a BPEL process this can be useful, and you can adapt it to fit your needs. First of all, let's see how to add 1 …
Originally, this post was published on Monitis Blog, you can check it here . In business circles, we sometimes hear that today is the “age of the customer.” And so it is. Thanks to the enormous advances over the past few years in consumer techno…
Viewers will learn about if statements in Java and their use The if statement: The condition required to create an if statement: Variations of if statements: An example using if statements:
HTML5 has deprecated a few of the older ways of showing media as well as offering up a new way to create games and animations. Audio, video, and canvas are just a few of the adjustments made between XHTML and HTML5. As we learned in our last micr…
Suggested Courses

762 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question