?
Solved

How can I get this to work with a submit button?

Posted on 2003-03-03
5
Medium Priority
?
174 Views
Last Modified: 2008-02-20
I have several functions that are operating off a submit button, but basically I need this one to work, and it doesn't seem to like anything but an "input type='button'"  

Is there any way to make it work with a button type of "submit"???


<html>
<head>
<style>
.button2     { border:outset 2px; font-size:11px; background:#FAE6BF; color:blue;}
</style>

<script language="javascript">
var time_now = new Date();
function blink_the_buttons(){
     temp_now = new Date();
     check = temp_now - time_now;
     for (i=0;i<blink_buttons.length;i++){
          if ((blink_buttons[i][2] * blink_buttons[i][3]) < check){
               obj = eval(blink_buttons[i][0]);
               blink_buttons[i][3] = blink_buttons[i][3] + 1;
               if (blink_buttons[i][4] == true){
                    obj.value = "";
                    blink_buttons[i][4] = false;
               } else {
                    obj.value = blink_buttons[i][1];
                    blink_buttons[i][4] = true;
               }
          }
     }
setTimeout("blink_the_buttons()",0);
}

</script>
</head>
<body>
<form name=myform>
<input class="button2" type=button value="Second blinking text" name=processing style="width:150;" onclick="blink_the_buttons();">
</form>
</body>
</html>

<script language="javascript">
var blink_buttons = new Array();
blink_buttons[0] = new Array(document.myform.processing,"Second blinking text",400,0,true);
</script>
0
Comment
Question by:byteslinger
[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
  • 2
5 Comments
 

Expert Comment

by:voldo37
ID: 8062257
Put the call to the function in the onSubmit event of the form.  You will also need to return false from the function to prevent the form from submitting which kind of defeats the purpose of the submit button.

setTimeout("blink_the_buttons()",0);
return false;
}

<form name=myform onsubmit="return blink_the_buttons();">

0
 

Author Comment

by:byteslinger
ID: 8062416
so you're saying there's no way to pass data and still have the button blink?

the reason I want this to work is because the submission process can take several seconds, and I want to use this method to inform the user that something's happening.
0
 
LVL 2

Expert Comment

by:miskate
ID: 8062540
So you want to blink while the submit is getting it's act in gear? In otherwords, you *do* want to submit, but there's a delay.


function blink_the_buttons(f){
// code for blink_the_buttons
   f.submit();
}

with
<form name="myform">
<input class="button2" type=button value="Second blinking text" name=processing style="width:150;" onclick="blink_the_buttons(this.form);">
</form>

OR

function blink_the_buttons(){
// code for blink_the_buttons
   return true;
}
 with
<form name=myform onsubmit="return blink_the_buttons()">
<input class="button2" type=submit value="Second blinking text" name=processing style="width:150;" >
</form>
0
 
LVL 2

Accepted Solution

by:
miskate earned 180 total points
ID: 8062580
Actually, scratch the above - I didn't notice the settimeout. Try the following: create an onclick handler for the button that submits the form, then calls the blink function. For example the following managed to count up to about 50 before the page in question loaded when I tested it:

<script>
function mysubmit(f) {
  f.submit();
   count();
  }
 
  function count() {
    document.getElementById("x").innerHTML ++;
   setTimeout("count()",1);
  }
  </script>
  <div id="x">0</div>
  <form action="http://bigslowpage.com">
  <input type="button" onclick="mysubmit(this.form)">
  </form>
0
 

Author Comment

by:byteslinger
ID: 8062623
Perfect! Thanks for the hint! Here's the finished product (sort of)

<html>
<head><title></title>
<style>
.button2     { border:outset 2px; font-size:11px; background:#FAE6BF; color:blue;}
</style>

<script language="javascript">
<!--
var time_now = new Date();
function blinkIt(){
     temp_now = new Date();
     check = temp_now - time_now;
     for (i=0;i<blink_buttons.length;i++){
          if ((blink_buttons[i][2] * blink_buttons[i][3]) < check){
               obj = eval(blink_buttons[i][0]);
               blink_buttons[i][3] = blink_buttons[i][3] + 1;
               if (blink_buttons[i][4] == true){
                    obj.value = "";
                    blink_buttons[i][4] = false;
               } else {
                    obj.value = blink_buttons[i][1];
                    blink_buttons[i][4] = true;
               }
          }
     }
setTimeout("blinkIt()",0);
}
function mysubmit(f) {
     f.submit();
     blinkIt();
}
//-->
</script>
</head>
<body>

<form name=myform action="http://bigslowpage.com">
<input class="button2" type="button" value="Submit" name=processing style="width:150;" onclick="mysubmit(this.form);">
</form>

<script language="javascript">
var blink_buttons = new Array();
blink_buttons[0] = new Array(document.myform.processing,"Submitting...",500,0,true);
</script>

</body>
</html>
0

Featured Post

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

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

Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

771 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