HTML Form Locking By User Session

Question

I have created a web site that allows for the submission of HTML forms with multiple stages of form authorisation. For example a Employee Submits a Leave Application which is then Authorised by a Supervisor. Multiple users may have the permission to authorise a form at any particular stage.

The issue i have run into is only 1 user should be able to edit the form at any stage.

My idea was on page load set a IsLocked column in the database to true when the page loads and i can use this to see if anyone else has it locked. I would then set it back to 0 when the person leaves the page. A person can leave the page by modifying the form and clicking submit or just by navigating away.

I can easily lock the page or check if its locked using the document.ready function and a ajax request or doing it straight in PHP however i am stuck in finding a way to remove the lock when the page gets redirected.

I have looked into the following methods:

http://www.bennadel.com/blog/1520-binding-events-to-non-dom-objects-with-jquery.htm (Using a custom function which constantly checks to see if the href has changed. I can't seem to get this function to work in Chrome, Firefox, IE)
https://developer.mozilla.org/en-US/docs/Web/Events/popstate (The problem us it only called when the forward or back buttons in web browser are used)

Question: How can l reliably get when a user has left the page? Is there a better way to handle the form locking mechanism?

score 0 · Answer 1 · answered Sep 13 '16 at 08:54

0

How about storing the sessionID, and then on the redirect page (that I assume the user only gets to if succesfully completed the form), you use the sessionID to see if it is the one holding the lock, and if so, remove it

answered Sep 13 '16 at 08:54

jonbdk

48
7

Thanks for your input :) A user can redirect without submitting the form, hence the issue – MattLaza Sep 13 '16 at 09:00

score 0 · Accepted Answer · edited May 23 '17 at 12:19

0

I would recommend WebSockets. They provide real-time communication between connected clients to a server. This could solve your problem by broadcasting a message to all user's about which forms are locked.

You have a few options for the websocker server, a popular one being NodeJs. Take a look at this answer for the various libraries available.

Once your server is running, each client could broadcast a message to the other clients with the form that needs to be locked:

// Send text to all users through the server
function sendText() {
  // Construct a msg object containing the data the server needs to process the message from the client.
  var msg = {
    type: "message",
    text: document.getElementById("myLockedForm").id,
    id:   clientID,
    date: Date.now()
  };

  // Send the msg object as a JSON-formatted string.
  exampleSocket.send(JSON.stringify(msg));

}

edited May 23 '17 at 12:19

Community

1
1

answered Sep 13 '16 at 09:01

Daniel Minnaar

5,865
5
31
52

Thanks for your help. How would l be able to send a message to the web socket server telling it not to block a form – MattLaza Sep 13 '16 at 13:24
Your clients broadcast a message on a regular interval with the form's id they're currently using. If client A receives a message from the server (which was broadcast by client B) with a message of 'form1' - then client A must disable form1 so the user know's its being used by someone else. There are many ways to skin this cat, but the key is to communicate the action of a client to all other clients. – Daniel Minnaar Sep 14 '16 at 08:25
Yes this is perfect. My requirements have changed a little as now i have other programs also require locking. Using Web Sockets means i can have a constant locking of the forms across all platforms – MattLaza Sep 20 '16 at 06:31

HTML Form Locking By User Session

2 Answers2