Disable submit button on a separate php file when timer runs down on javascript file

Question

I have a php form and a separate javascript file called countdown.js that runs down a timer to a target date and then displays a message, ive tried various things to get the submit button to disable when this has finished.

This is my form

<form id="MakeBid" action="MakeBid.php" method="POST">
<input type="hidden" name="propertyID" value ="1"/>
<div>Bid Now <input type="text" name="pricesoldfor"/></div> 
<input id = "submit" input type="submit" value="Submit" /> 
</form>

This is my java code

function calcage(secs, num1, num2) {
    s = ((Math.floor(secs / num1)) % num2).toString();
    if (LeadingZero && s.length < 2) s = "0" + s;
    return "<b>" + s + "</b>";
}

function CountBack(secs) {
    if (secs < 0) {
        document.getElementById("cntdwn").innerHTML = FinishMessage;


        return;
    }
    DisplayStr = DisplayFormat.replace(/%%D%%/g, calcage(secs, 86400, 100000));
    DisplayStr = DisplayStr.replace(/%%H%%/g, calcage(secs, 3600, 24));
    DisplayStr = DisplayStr.replace(/%%M%%/g, calcage(secs, 60, 60));
    DisplayStr = DisplayStr.replace(/%%S%%/g, calcage(secs, 1, 60));
    document.getElementById("cntdwn").innerHTML = DisplayStr;
    if (CountActive) setTimeout("CountBack(" + (secs + CountStepper) + ")", SetTimeOutPeriod);
}

function putspan(backcolor, forecolor) {
    document.write("<span id='cntdwn' style='background-color:" + backcolor + "; color:" + forecolor + "'></span>");
}

if (typeof(BackColor) == "undefined") BackColor = "white";
if (typeof(ForeColor) == "undefined") ForeColor = "black";
if (typeof(TargetDate) == "undefined") TargetDate = "12/31/2020 5:00 AM";
if (typeof(DisplayFormat) == "undefined") DisplayFormat = "%%D%% Days, %%H%% Hours, %%M%% Minutes, %%S%% Seconds.";
if (typeof(CountActive) == "undefined") CountActive = true;
if (typeof(FinishMessage) == "undefined") FinishMessage = "";
if (typeof(CountStepper) != "number") CountStepper = -1;
if (typeof(LeadingZero) == "undefined") LeadingZero = true;
CountStepper = Math.ceil(CountStepper);
if (CountStepper == 0) CountActive = false;
var SetTimeOutPeriod = (Math.abs(CountStepper) - 1) * 1000 + 990;
putspan(BackColor, ForeColor);
var dthen = new Date(TargetDate);
var dnow = new Date();
if (CountStepper > 0) ddiff = new Date(dnow - dthen);
else ddiff = new Date(dthen - dnow);
gsecs = Math.floor(ddiff.valueOf() / 1000);
CountBack(gsecs);

**Never** pass a string to `setInterval()` or `setTimeout()`. Doing so is as bad as using `eval()` and it results in unreadable and possibly insecure code as soon as you use variables since you need to insert them into the string instead of passing the actual variable. The proper solution is `setInterval(function() { /* your code *) }, msecs);`. The same applies to `setTimeout()`. If you just want to call a single function without any arguments, you can also pass the function name directly: `setInterval(someFunction, msecs);` (note that there are **no** `()` behind the function name) — ThiefMaster, Apr 19 '12 at 10:45

score 0 · Accepted Answer · edited May 23 '17 at 11:49

0

I preassumed that your timer is working well and message is showed correctly.

Did you try to use jQuery? To disable submit button simply insert this line:

$("input[type=submit]").attr("disabled", "disabled");

Is this what you wanted to achieve?

Also below I pasted you link with similar question resolved:

jQuery disable/enable submit button

EDIT:

According to your code (and assuming it's working), do the following:

Add jQuery to your site: http://jquery.com/
Modify your CountBack function, adding code I provided after document.getElementById("cntdwn").innerHTML = FinishMessage; and before return;

Should work!

edited May 23 '17 at 11:49

Community

1
1

answered Apr 19 '12 at 10:39

Karol

7,803
9
49
67

1

or even better, `.prop('disabled', true)` – ThiefMaster Apr 19 '12 at 10:44
however i have a problem, when the page then reloads the button then reappears – Jobbo05 Apr 20 '12 at 00:29
1

because when you reload the page you reload scripts and everything starts over. You need to save the state somewhere (session, db), but this is not the scope of the question... and if it works you should mark the answer as acceptable. – Karol Apr 20 '12 at 09:03

Disable submit button on a separate php file when timer runs down on javascript file

1 Answers1