How to disable an input field, based on the displayed user text?

182 Views Asked by At

I have this code snippet that works:

var oldInput = document.getElementsByName ("prio");
oldInput[0].setAttribute ("disabled", "disabled");

And this is the relevant, target-page HTML (corrected):

<div id="content">
    <p>(CONTENT)</p>
    <form>
      <p>Priority: <input name="prio" type="text" value="285"></p>
      <p>Success: <input name="succ" type="text" value="6"></p>
    </form>
</div>
<table border="0" cellspacing="0" width="100%">
    <tbody>
        <tr>
            <td class="user">
            &nbsp;
            <a href="#" class="nav" title="Logout John">Logout</a>

            &nbsp;(User: John)
            </td>
        </tr>
    </tbody>
</table>

See it at jsfiddle.net/Kc3BB/3.

I have 1 access-point for many users. but I want 5 users to be able to change the prio value. You can see that the username is in the footer.

Is it possible to do that in javascript with the code above for Firefox 2.x and without jQuery?

Example:

if USER (from footer) == JOHN || LUKE || JEFF || MAX || ANDY
do nothing

else
disable PRIO BOX (from content)
3

There are 3 best solutions below

7
On BEST ANSWER

This should work in Firefox 2.0:

//--- Make sure this list of names is all uppercase.
var usersWhoCanSetPriority = ['JOHN', 'LUKE', 'JEFF', 'MAX', 'ANDY'];

var bDisablePrio    = true;
var tdNodes         = document.getElementsByTagName ("TD");
for (var J = tdNodes.length - 1;  J >= 0;  --J) {
    var tdNode      = tdNodes[J];
    if (tdNode.className == "user") {
        var userName        = tdNode.textContent.replace (
            /^(?:.|\n|\r)+\(User:\s+([^)]+)\)(?:.|\n|\r)+$/i, "$1"
        ).toUpperCase ();

        if (usersWhoCanSetPriority.indexOf (userName) > -1) {
            bDisablePrio    = false;
        }
    }
}

if (bDisablePrio) {
    var oldInput = document.getElementsByName ("prio");
    oldInput[0].setAttribute ("disabled", "disabled");
}

See the updated Fiddle.

5
On

Try this:

var tds = document.getElementsByTagName("TD",
    footerText = tds[tds - 1].textContent,
    user = footerText.match(/\(User: ([^\)]*\))/)[1].toUpperCase();

if (" JOHN LUKE JEFF MAX ANDY ".indexOf(" " + user + " ") !== -1) {
    // Do stuff
} else {
    // Do else stuff
    var oldInput = document.getElementsByName("prio");
    oldInput[0].setAttribute("disabled", "disabled");
}

Note: your pseudocode means the exact opposite of what you said in words. Fix the above code to your actual desires.

Edit: I couldn't remember if Firefox 2 supports indexOf on arrays. It does. So you can use this line instead:

if (["JOHN", "LUKE", "JEFF", "MAX", "ANDY"].indexOf(user) !== -1) {

Edit 2: I just saw your edit and changed the answer accordingly. I hope your HTML snippet actually reflects the page's source, or else finding that footer elements will need another method.

1
On
var allowed_users = ['John', 'Luke', 'Jeff', 'Max', 'Andy'];
var user = /\(User: ([^)]*)\)/.exec(document.getElementById('footer').textContent​​​​​​​​)[1];
if(allowed_users.indexOf(user) === -1) // user not in allowed_users array, disable priority
{
    var oldInput = document.getElementsByName('prio')[0];
    oldInput.setAttribute('disabled', 'disabled');
}