Disable Input Field Using Javascript

Question

I am trying to Disable One input Field(Instance Field A) when value in other input Field (Instance Field B) is greater then 0.00.

Script

function disableFields(){

var b = document.getElementById("B").valueOf();

if(b == 0){
document.getElementById("A").disabled=false;

}else{
document.getElementById("A").disabled=true;
}

JSF Code

<h:inputText id="B" value="" onkeydown="disableFields();">
<f:convertNumber type="number" groupingUsed="true" minFractionDigits="2" pattern="#0.00"/>
<a4j:ajax event="valueChange" execute="@this" render="A, messagePanel" />
</h:inputText>
</rich:column>

<h:inputText id="A" value="">
<f:convertNumber type="number" groupingUsed="true" minFractionDigits="2" pattern="#0.00"/>
<a4j:ajax event="valueChange" execute="@this" render="A, messagePanel" />
</h:inputText>
</rich:column>

Please create a code snippet or JSFiddle demonstrating your work in progress. — Seb Cooper, Jan 04 '17 at 22:14
`var b = +document.getElementById("B").value;` [`valueoOf()`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/valueOf) seems to be the wrong method to call; the `+` is a means by which the value of the element can be coerced into a number. — David Thomas, Jan 04 '17 at 22:14
`document.getElementById("A").disabled = parseFloat(document.getElementById("B").value) !== 0;` would be simpler to read, perhaps. — Heretic Monkey, Jan 04 '17 at 22:20

score 1 · Answer 1 · answered Jan 04 '17 at 22:28

Use value property to get the value of the input element.

function disableFields(){
  var b = parseFloat(document.getElementById("a").value);
  if(b > 0){
    document.getElementById("b").disabled=true;
  }else{
    document.getElementById("b").disabled=false;
  }
 }

<input type="number" id="a" onkeyup="disableFields();">
<input type="number" id="b">

score 0 · Answer 2 · answered Jan 04 '17 at 22:22

If you want to get value of an input in JS, this is the way:

document.getElementById("searchTxt").value

Now when you are trying to check in if statement, I highly suggest converting before comparing to avoid any unwanted behaviour (this is JS world):

var value = document.getElementById("B").value;
if(!!value && parseInt(value, 10) > 0) {
   //do stuff here
   document.getElementById("A").disabled = true;
} else {
   //other stuff here
   document.getElementById("A").disabled = false;
}

Disable Input Field Using Javascript

2 Answers2