Member Avatar for sibbs06

Is it possible to disable my submit button when my javascript timer has finished and has showed its end message.

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 type="submit" value="Submit" /> 
</form>

The java script message will be Auction ended when the timer reaches a specific date.

Thanks

Edited by Member #120589 because: moved to javascript forum
  • 2 Contributors
  • 2 Replies
  • 232 Views
  • 21 Hours Discussion Span
  • Latest Post Latest Post by sibbs06

Dani AI

Generated

Useful follow-up to and : disabling the submit button in the page with the timer is fine for UX, but if the form lives on another PHP page you need two things — sync the UI across pages/tabs, and make the server the authoritative gatekeeper so late POSTs are refused.

A practical, lightweight pattern:

  • Broadcast the end event from the timer page so other open tabs/pages can react (use localStorage storage events or the BroadcastChannel API).
  • On the form page, listen for that event and disable every control (not just the submit). Example JS pattern:
function disableFormControls(form) {
  form.querySelectorAll('input,button,select,textarea').forEach(el => el.disabled = true);
}

/* timer page: announce end */
localStorage.setItem('auction_1_ended', String(Date.now()));

/* form page: listen for announcements */
window.addEventListener('storage', (e) => {
  if (e.key === 'auction_1_ended') disableFormControls(document.getElementById('MakeBid'));
});

Notes: storage events work only across tabs/windows of the same origin; BroadcastChannel is an alternative for modern browsers. Update the local UI immediately in the tab that ran the timer, since storage won’t fire in that same tab.

Server-side enforcement (required): in MakeBid.php always load the auction end time from your database and compare it to the server clock. Reject or ignore bids if the auction is past. Minimal PHP pattern:

$endsAt = new DateTime($row['ends_at'], new DateTimeZone('UTC'));
$now = new DateTime('now', new DateTimeZone('UTC'));
if ($now >= $endsAt) { http_response_code(403); echo 'Auction ended'; exit; }

Also render the submit disabled when the PHP page is generated (for users with JS disabled). Finally, watch timezones, clock skew, and same-origin limits when debugging cross-page signaling.

Recommended Answers

All 2 Replies

Member Avatar for LaxLoafer

To disable the submit button in JavaScript try something like...

document.getElementById("mySubmit").disabled = true;

...where 'mySubmit' is an ID assigned to your input element...

<input id="mySubmit" type="submit" value="Submit" />

Further info here... http://www.w3schools.com/jsref/prop_submit_disabled.asp

Edited by LaxLoafer because: Revised answer.
Member Avatar for sibbs06

Thanks for the answer, what would the code be if the form was on another php page?

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.