CODEWITHSUNDEEP
javascriptformsif-statementgetelementbyidwindow.open
artchurro
artchurro

Reputation: 79

Getting element ID's for if/else statements

Working on a project. I need the else statement to work but when I hit the submit button it just redirects to the "if"

<head>
<script>
    var judgmentAmount = document.getElementById('judgmentAmount');
    var amountCollected = document.getElementById('amountCollected');
    function judgmentCalc() {
        if( judgmentAmount - amountCollected < 10000 ) {
            window.open( 'http://afjudgment.com' );
        }else {
            window.open( 'http://www.yahoo.com' );
        }
    }
</script>
</head>

<body>
<h1>Application</h1>
<p>I understand that this application neither obligates me to <b>Affirmative     Judgment</b> nor does it obligate <b>Affirmative Judgment</b> to me.</p>
<h3>Judgment Information</h3>
<form>
    <span>Do you have a case number?</span>
    <input type="text" name="caseNumber" />
    <span>Amount of Judgment</span>
    <input type="text" name="judgmentAmount" id="judgmentAmount"  />
    <span>Amount collected to date</span>
    <input type="text" name="amountCollected" id="amountCollected"  />
    <input type="submit" name="submitButton" onclick="judgmentCalc();" />
</form>

Upvotes: 0

Views: 14549

Answers (7)

Ali Mamedov
Ali Mamedov

Reputation: 5256

You need to operate with values of your elements:

function judgmentCalc() {

  var judgmentAmount = +document.getElementById('judgmentAmount').value;
  var amountCollected = +document.getElementById('amountCollected').value;

  if( judgmentAmount - amountCollected < 10000 ) {
    window.open( 'http://afjudgment.com' );
  } 
  else {
    window.open( 'http://www.yahoo.com' );
  }
}

var judgmentAmount = document.getElementById('judgmentAmount') returns only a reference to element with ID "judgmentAmount". If you want to use element's value, you need to do this:

var judgmentAmount = document.getElementById('judgmentAmount').value.

The next step is calculating some amount. You need to convert string to int (with + operator)

typeof judgmentAmount; // "string"

typeof +judgmentAmount; // "number"

Demo

Upvotes: 0

Harsh Sanghani
Harsh Sanghani

Reputation: 1722

You have to compare the value of the input element, Please try the following 

function judgmentCalc() {
    var judgmentAmount = document.getElementById('judgmentAmount').value;
    var amountCollected = document.getElementById('amountCollected').value;

    if( (judgmentAmount - amountCollected) < 10000 ) {
        window.open( 'http://afjudgment.com' );
    } else {
        window.open( 'http://www.yahoo.com' );
    }
}

It may help you.

Upvotes: -1

Hardev Sharma
Hardev Sharma

Reputation: 55

Please run the script below, it'll work fine:

<head>
<script>
    function judgmentCalc() {
        var judgmentAmount = document.getElementById('judgmentAmount').value;
        var amountCollected = document.getElementById('amountCollected').value;

        var exp = parseFloat(judgmentAmount) - parseFloat(amountCollected);

        if( exp < 10000 ) {
            window.open( 'http://afjudgment.com' );
        } else {
            window.open( 'http://www.yahoo.com' );
        }
    }
</script>
</head>

Upvotes: -1

jasonscript
jasonscript

Reputation: 6180

You're getting the HTML DOM elements here:

var judgmentAmount = document.getElementById('judgmentAmount');
var amountCollected = document.getElementById('amountCollected');

So in your judgementCalc method you need to get the values of those elements:

function judgmentCalc() {
    // notice that we're using VALUE here:
    if( judgmentAmount.value - amountCollected.value < 10000 ) {
        window.open( 'http://afjudgment.com' );
    }else {
        window.open( 'http://www.yahoo.com' );
    }
}

Upvotes: 0

gurvinder372
gurvinder372

Reputation: 68433

You are only comparing the objects, you need to compare their values

var judgmentAmount = Number(document.getElementById('judgmentAmount').value);
var amountCollected = Number(document.getElementById('amountCollected').value);

Also, convert them to Number before comparison.

function judgmentCalc() {
    var judgmentAmount = Number(document.getElementById('judgmentAmount').value);
    var amountCollected = Number(document.getElementById('amountCollected').value);
    if( judgmentAmount - amountCollected < 10000 ) {
        window.open( 'http://afjudgment.com' );
    }else {
        window.open( 'http://www.yahoo.com' );
    }
}

Upvotes: 0

or hor
or hor

Reputation: 723

move your variables inside the function so they are properly filled at the time of function execution, and add .value properties of the DOM elements.

try this:

    function judgmentCalc() {
      var judgmentAmount = document.getElementById('judgmentAmount').value;
      var amountCollected = document.getElementById('amountCollected').value;
        if( judgmentAmount - amountCollected < 10000 ) {
            window.open( 'http://afjudgment.com' );
        }else {
            window.open( 'http://www.yahoo.com' );
        }
    }

Upvotes: 0

Shoaib Shakeel
Shoaib Shakeel

Reputation: 1557

You need to access values of these input fields instead of directly working on dom elemens returned by document.getElementById(). You can get value of input using .value property.

var judgmentAmount = document.getElementById('judgmentAmount').value;
var amountCollected = document.getElementById('amountCollected').value;

Upvotes: 0

Related Questions