Enable/Disable Textboxes - Programmers Heaven

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Categories

Enable/Disable Textboxes

Fiorina81Fiorina81 Posts: 2Member
I am new to Javascript and I have a form that has 6 textboxes on it. If txtbox1 receives text then the 5 other textboxes become disabled. If you clear the text in txtbox1 all textboxes become enabled. Can some one help me please.

Thanks

Comments

  • ArchatasArchatas Posts: 21Member
    let's say that every textbox has an id consisting of "txtbox" and its number, like "txtbox1", "txtbox2", and so on.

    add this to txtbox1 attributes:
    onchange="changeOthers()"

    add this function to the script section:
    changeOthers() {
    // let oTxtbox1..oTxtbox6 be pointers to text box objects
    var oTxtbox1 = document.getElementById("txtbox1");
    var oTxtbox2 = document.getElementById("txtbox2");
    var oTxtbox3 = document.getElementById("txtbox3");
    var oTxtbox4 = document.getElementById("txtbox4");
    var oTxtbox5 = document.getElementById("txtbox5");
    var oTxtbox6 = document.getElementById("txtbox6");
    // if txtbox1 is not empty
    if (oTxtbox1.value) {
    // disable other text boxes
    oTxtbox2.disabled = true;
    oTxtbox3.disabled = true;
    oTxtbox4.disabled = true;
    oTxtbox5.disabled = true;
    oTxtbox6.disabled = true;
    // else it is empty so
    } else {
    // enable other text boxes
    oTxtbox2.disabled = false;
    oTxtbox3.disabled = false;
    oTxtbox4.disabled = false;
    oTxtbox5.disabled = false;
    oTxtbox6.disabled = false;
    }
    }

    There are also shorter ways to write this function, however this is done like this for you to understand the script, but not just copy and paste it.

    [hr]Good luck!
    [b]Aidas Bendoraitis[/b] aka [b]Archatas[/b][hr]

  • Fiorina81Fiorina81 Posts: 2Member
    Thanks for your help!!

    : let's say that every textbox has an id consisting of "txtbox" and its number, like "txtbox1", "txtbox2", and so on.
    :
    : add this to txtbox1 attributes:
    : onchange="changeOthers()"
    :
    : add this function to the script section:
    : changeOthers() {
    : // let oTxtbox1..oTxtbox6 be pointers to text box objects
    : var oTxtbox1 = document.getElementById("txtbox1");
    : var oTxtbox2 = document.getElementById("txtbox2");
    : var oTxtbox3 = document.getElementById("txtbox3");
    : var oTxtbox4 = document.getElementById("txtbox4");
    : var oTxtbox5 = document.getElementById("txtbox5");
    : var oTxtbox6 = document.getElementById("txtbox6");
    : // if txtbox1 is not empty
    : if (oTxtbox1.value) {
    : // disable other text boxes
    : oTxtbox2.disabled = true;
    : oTxtbox3.disabled = true;
    : oTxtbox4.disabled = true;
    : oTxtbox5.disabled = true;
    : oTxtbox6.disabled = true;
    : // else it is empty so
    : } else {
    : // enable other text boxes
    : oTxtbox2.disabled = false;
    : oTxtbox3.disabled = false;
    : oTxtbox4.disabled = false;
    : oTxtbox5.disabled = false;
    : oTxtbox6.disabled = false;
    : }
    : }
    :
    : There are also shorter ways to write this function, however this is done like this for you to understand the script, but not just copy and paste it.
    :
    : [hr]Good luck!
    : [b]Aidas Bendoraitis[/b] aka [b]Archatas[/b][hr]
    :
    :

Sign In or Register to comment.