How to change tag value to default if user enters less than specified value?

-1

In my HTML form, there are 3 input tags. The type of input tag has been set to number. The form is working well for calculating sum of 3 inputs.

But the problem arises when user enters negative values in input. Therefore, I want my code to change values entered in input tag to default of those where user has entered a value less than 0. The action should be performed when input type="button" is clicked.

Here is my code:

<HTML>

<head><title>Calculation</title>

</head>

<body>

<form>



   PE Ratio

    <input type="number"  id="PE" /><br>

    

  ROCE  

    <input type="number" id="ROCE" /><br>

   

  Sales Growth 

     <input type="number" id="SG" /> <br> 

    

   <input type="button" Value="Multiply" style="height: 30px; width: 150px; left: 250; top: 250;"    onsubmit="return false"  onclick="amount.value = (15 -( PE.valueAsNumber/2)) + (40 - (ROCE.valueAsNumber)) + (10-(SG.valueAsNumber))">

  

   <p>Rating: <div id="div1">

   <strong><output name="amount" for="hours rate vat">0</output></strong></div>

   </p>

     </form>

</body>

</HTML>

for (PE) ID input, default value is 7
for (ROCE) ID input, default value is 5
for ( SG) id input, dafault value is 4

I am not sure how should I do this.

edited Dec 28 '18 at 20:45

mx0

2,64982431

asked Dec 28 '18 at 19:46

Sparsh Goyal

Have you read this developer.mozilla.org/en-US/docs/Learn/HTML/Forms/…?

– mx0
Dec 28 '18 at 19:54

add a comment |

-1

Here is my code:

<HTML>

<head><title>Calculation</title>

</head>

<body>

<form>



   PE Ratio

    <input type="number"  id="PE" /><br>

    

  ROCE  

    <input type="number" id="ROCE" /><br>

   

  Sales Growth 

     <input type="number" id="SG" /> <br> 

    

   <input type="button" Value="Multiply" style="height: 30px; width: 150px; left: 250; top: 250;"    onsubmit="return false"  onclick="amount.value = (15 -( PE.valueAsNumber/2)) + (40 - (ROCE.valueAsNumber)) + (10-(SG.valueAsNumber))">

  

   <p>Rating: <div id="div1">

   <strong><output name="amount" for="hours rate vat">0</output></strong></div>

   </p>

     </form>

</body>

</HTML>

for (PE) ID input, default value is 7
for (ROCE) ID input, default value is 5
for ( SG) id input, dafault value is 4

I am not sure how should I do this.

edited Dec 28 '18 at 20:45

mx0

2,64982431

asked Dec 28 '18 at 19:46

Sparsh Goyal

Have you read this developer.mozilla.org/en-US/docs/Learn/HTML/Forms/…?

– mx0
Dec 28 '18 at 19:54

add a comment |

-1

Here is my code:

<HTML>

<head><title>Calculation</title>

</head>

<body>

<form>



   PE Ratio

    <input type="number"  id="PE" /><br>

    

  ROCE  

    <input type="number" id="ROCE" /><br>

   

  Sales Growth 

     <input type="number" id="SG" /> <br> 

    

   <input type="button" Value="Multiply" style="height: 30px; width: 150px; left: 250; top: 250;"    onsubmit="return false"  onclick="amount.value = (15 -( PE.valueAsNumber/2)) + (40 - (ROCE.valueAsNumber)) + (10-(SG.valueAsNumber))">

  

   <p>Rating: <div id="div1">

   <strong><output name="amount" for="hours rate vat">0</output></strong></div>

   </p>

     </form>

</body>

</HTML>

for (PE) ID input, default value is 7
for (ROCE) ID input, default value is 5
for ( SG) id input, dafault value is 4

I am not sure how should I do this.

edited Dec 28 '18 at 20:45

mx0

2,64982431

asked Dec 28 '18 at 19:46

Sparsh Goyal

Here is my code:

<HTML>

<head><title>Calculation</title>

</head>

<body>

<form>



   PE Ratio

    <input type="number"  id="PE" /><br>

    

  ROCE  

    <input type="number" id="ROCE" /><br>

   

  Sales Growth 

     <input type="number" id="SG" /> <br> 

    

   <input type="button" Value="Multiply" style="height: 30px; width: 150px; left: 250; top: 250;"    onsubmit="return false"  onclick="amount.value = (15 -( PE.valueAsNumber/2)) + (40 - (ROCE.valueAsNumber)) + (10-(SG.valueAsNumber))">

  

   <p>Rating: <div id="div1">

   <strong><output name="amount" for="hours rate vat">0</output></strong></div>

   </p>

     </form>

</body>

</HTML>

for (PE) ID input, default value is 7
for (ROCE) ID input, default value is 5
for ( SG) id input, dafault value is 4

I am not sure how should I do this.

<HTML>

<head><title>Calculation</title>

</head>

<body>

<form>



   PE Ratio

    <input type="number"  id="PE" /><br>

    

  ROCE  

    <input type="number" id="ROCE" /><br>

   

  Sales Growth 

     <input type="number" id="SG" /> <br> 

    

   <input type="button" Value="Multiply" style="height: 30px; width: 150px; left: 250; top: 250;"    onsubmit="return false"  onclick="amount.value = (15 -( PE.valueAsNumber/2)) + (40 - (ROCE.valueAsNumber)) + (10-(SG.valueAsNumber))">

  

   <p>Rating: <div id="div1">

   <strong><output name="amount" for="hours rate vat">0</output></strong></div>

   </p>

     </form>

</body>

</HTML>

<HTML>

<head><title>Calculation</title>

</head>

<body>

<form>



   PE Ratio

    <input type="number"  id="PE" /><br>

    

  ROCE  

    <input type="number" id="ROCE" /><br>

   

  Sales Growth 

     <input type="number" id="SG" /> <br> 

    

   <input type="button" Value="Multiply" style="height: 30px; width: 150px; left: 250; top: 250;"    onsubmit="return false"  onclick="amount.value = (15 -( PE.valueAsNumber/2)) + (40 - (ROCE.valueAsNumber)) + (10-(SG.valueAsNumber))">

  

   <p>Rating: <div id="div1">

   <strong><output name="amount" for="hours rate vat">0</output></strong></div>

   </p>

     </form>

</body>

</HTML>

javascript html html5

edited Dec 28 '18 at 20:45

mx0

2,64982431

asked Dec 28 '18 at 19:46

Sparsh Goyal

edited Dec 28 '18 at 20:45

mx0

2,64982431

asked Dec 28 '18 at 19:46

Sparsh Goyal

edited Dec 28 '18 at 20:45

mx0

2,64982431

edited Dec 28 '18 at 20:45

mx0

2,64982431

edited Dec 28 '18 at 20:45

mx0

2,64982431

asked Dec 28 '18 at 19:46

Sparsh Goyal

asked Dec 28 '18 at 19:46

Sparsh Goyal

asked Dec 28 '18 at 19:46

Sparsh Goyal

Have you read this developer.mozilla.org/en-US/docs/Learn/HTML/Forms/…?

– mx0
Dec 28 '18 at 19:54

add a comment |

Have you read this developer.mozilla.org/en-US/docs/Learn/HTML/Forms/…?

– mx0
Dec 28 '18 at 19:54

Have you read this developer.mozilla.org/en-US/docs/Learn/HTML/Forms/…?

– mx0
Dec 28 '18 at 19:54

add a comment |

3 Answers
3

active

oldest

votes

How I will do it is
First make a javascript file like abc.js
write the following code in it

function corrector(){

var x = document.getElementById("PE").value;

var y = document.getElementById("ROCE").value;

var z = document.getElementById("SG").value;

if(x<0)

x=7;

if(y<0)

y=5;

if(z<0)

z=4;

}

Now include the js file in the main html file
Include the rest of the logic in this js file only.

 <input type="button" Value="Multiply" style="height: 30px; width: 150px; left: 250; 

 top: 250;"    onsubmit="return false"  onclick="corrector()">

answered Dec 28 '18 at 20:06

AK10

Where I have to add rest of the logic??? Please tell me through a complete HTML code....

– Sparsh Goyal
Dec 29 '18 at 5:15

just add your logic in the corrector function after the last if condition

– AK10
Dec 29 '18 at 9:02

Like var ans = 15 - x/2 + 40-y + 10-z

– AK10
Dec 29 '18 at 9:04

I tried to add var ans =15- x/2 + 40-y + 10-z after last if condition....but it is not working....I don't have enough knowledge of JavaScript..... So, can you please edit your code according to my question and give me the full answer..............thanks in advance....

– Sparsh Goyal
Dec 29 '18 at 12:59

add a comment |

It helps to separate out your code from your markup - I moved the onclick logic to a calculate function which does the validation you want. I also simplified your math.

function calculate() {

  const defaults = {PE: 7, ROCE: 5, SG: 4};

  const values = {};

  Object.keys(defaults).forEach(id => {

    const el = document.getElementById(id);

    if (el.value < 0) {

      el.value = defaults[id];

    }

    values[id] = el.value;

  });

  document.getElementsByName('amount')[0].value = 65 - values.PE/2 - values.ROCE - values.SG

}

<HTML>

<head><title>Calculation</title>

</head>

<body>

<form>

  PE Ratio

    <input type="number" min="0" id="PE" /><br>

    

  ROCE  

    <input type="number" id="ROCE" /><br>

   

  Sales Growth 

     <input type="number" id="SG" /> <br> 

    

   <input type="button" Value="Multiply" style="height: 30px; width: 150px; left: 250; top: 250;"    onsubmit="return false"  onclick="calculate()">

  

   <p>Rating: <div id="div1">

   <strong><output name="amount" for="hours rate vat">0</output></strong></div>

   </p>

     </form>

</body>

</HTML>

edited Dec 28 '18 at 20:43

answered Dec 28 '18 at 20:25

ic3b3rg

10.7k41945

I think you have an error. You should compare input value with 0 and use default if it's less then 0.

– mx0
Dec 28 '18 at 20:42

thanks! adjusted

– ic3b3rg
Dec 28 '18 at 20:43

Your code is working well....but my formula or logic for calculating sum was different...and you used a complete different method....I tried to change your logic as per my convince, but after that code is giving very different output....please edit your code and make sure the logic remain same...

– Sparsh Goyal
Dec 29 '18 at 5:43

thanks! the formula reduces to what I've used

– ic3b3rg
Dec 29 '18 at 5:45

add a comment |

You can't do that when all your code is thrown into an HTML form. I removed the form (if you really need it, tell me and I'll change the code). I also changed your form code into simpler JavaScript code.

I made it so that you can just copy & paste the code into one script.

If something doesn't work the way you want to. Let me know.

<HTML>



<head>

  <title>Calculation</title>

</head>



<body>



  PE Ratio <input type="number" id="PE" /><br> ROCE <input type="number" id="ROCE" /><br> Sales Growth <input type="number" id="SG" /> <br>



  <button onsubmit="return false" onclick="Multiply()" style="height: 30px; width: 150px; left: 250; top: 250;" onsubmit="return false">Multiply</button>



  <p>Rating</p>

  <b id="output">0</b>

</body>

<script>

  var output = document.getElementById("output");



  function Multiply() {



    var a = isNaN(PE.valueAsNumber) ? 7 : PE.valueAsNumber;

    var b = isNaN(ROCE.valueAsNumber) ? 5 : ROCE.valueAsNumber;

    var c = isNaN(SG.valueAsNumber) ? 4 : SG.valueAsNumber;



    if (PE.valueAsNumber < 0 || SG.valueAsNumber < 0 || ROCE.valueAsNumber < 0)

      output.innerHTML = "No negetive numbers"

    else

      output.innerHTML = 15 - a / 2 + 40 - b + 10 - c;

  }

</script>



</HTML>

edited Dec 29 '18 at 7:55

answered Dec 28 '18 at 20:39

Vincent

627

I want to change input values with default one.....don't want to show message...

– Sparsh Goyal
Dec 29 '18 at 5:41

I changed the code, but I wasn't quite sure what you needed. I deleted the value in the input fields but made it so if you leave the input fields blank it would still use the default value.

– Vincent
Dec 29 '18 at 7:50

add a comment |

Your Answer

StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});

}
});

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53963621%2fhow-to-change-input-tag-value-to-default-if-user-enters-less-than-specified-va%23new-answer', 'question_page');
}
);

Post as a guest

Name

Required, but never shown

3 Answers
3

active

oldest

votes

3 Answers
3

active

oldest

votes

How I will do it is
First make a javascript file like abc.js
write the following code in it

function corrector(){

var x = document.getElementById("PE").value;

var y = document.getElementById("ROCE").value;

var z = document.getElementById("SG").value;

if(x<0)

x=7;

if(y<0)

y=5;

if(z<0)

z=4;

}

Now include the js file in the main html file
Include the rest of the logic in this js file only.

 <input type="button" Value="Multiply" style="height: 30px; width: 150px; left: 250; 

 top: 250;"    onsubmit="return false"  onclick="corrector()">

answered Dec 28 '18 at 20:06

AK10

Where I have to add rest of the logic??? Please tell me through a complete HTML code....

– Sparsh Goyal
Dec 29 '18 at 5:15

just add your logic in the corrector function after the last if condition

– AK10
Dec 29 '18 at 9:02

Like var ans = 15 - x/2 + 40-y + 10-z

– AK10
Dec 29 '18 at 9:04

I tried to add var ans =15- x/2 + 40-y + 10-z after last if condition....but it is not working....I don't have enough knowledge of JavaScript..... So, can you please edit your code according to my question and give me the full answer..............thanks in advance....

– Sparsh Goyal
Dec 29 '18 at 12:59

add a comment |

How I will do it is
First make a javascript file like abc.js
write the following code in it

function corrector(){

var x = document.getElementById("PE").value;

var y = document.getElementById("ROCE").value;

var z = document.getElementById("SG").value;

if(x<0)

x=7;

if(y<0)

y=5;

if(z<0)

z=4;

}

Now include the js file in the main html file
Include the rest of the logic in this js file only.

 <input type="button" Value="Multiply" style="height: 30px; width: 150px; left: 250; 

 top: 250;"    onsubmit="return false"  onclick="corrector()">

answered Dec 28 '18 at 20:06

AK10

Where I have to add rest of the logic??? Please tell me through a complete HTML code....

– Sparsh Goyal
Dec 29 '18 at 5:15

just add your logic in the corrector function after the last if condition

– AK10
Dec 29 '18 at 9:02

Like var ans = 15 - x/2 + 40-y + 10-z

– AK10
Dec 29 '18 at 9:04

I tried to add var ans =15- x/2 + 40-y + 10-z after last if condition....but it is not working....I don't have enough knowledge of JavaScript..... So, can you please edit your code according to my question and give me the full answer..............thanks in advance....

– Sparsh Goyal
Dec 29 '18 at 12:59

add a comment |

How I will do it is
First make a javascript file like abc.js
write the following code in it

function corrector(){

var x = document.getElementById("PE").value;

var y = document.getElementById("ROCE").value;

var z = document.getElementById("SG").value;

if(x<0)

x=7;

if(y<0)

y=5;

if(z<0)

z=4;

}

Now include the js file in the main html file
Include the rest of the logic in this js file only.

 <input type="button" Value="Multiply" style="height: 30px; width: 150px; left: 250; 

 top: 250;"    onsubmit="return false"  onclick="corrector()">

answered Dec 28 '18 at 20:06

AK10

How I will do it is
First make a javascript file like abc.js
write the following code in it

function corrector(){

var x = document.getElementById("PE").value;

var y = document.getElementById("ROCE").value;

var z = document.getElementById("SG").value;

if(x<0)

x=7;

if(y<0)

y=5;

if(z<0)

z=4;

}

Now include the js file in the main html file
Include the rest of the logic in this js file only.

 <input type="button" Value="Multiply" style="height: 30px; width: 150px; left: 250; 

 top: 250;"    onsubmit="return false"  onclick="corrector()">

answered Dec 28 '18 at 20:06

AK10

answered Dec 28 '18 at 20:06

AK10

answered Dec 28 '18 at 20:06

AK10

answered Dec 28 '18 at 20:06

AK10

Where I have to add rest of the logic??? Please tell me through a complete HTML code....

– Sparsh Goyal
Dec 29 '18 at 5:15

just add your logic in the corrector function after the last if condition

– AK10
Dec 29 '18 at 9:02

Like var ans = 15 - x/2 + 40-y + 10-z

– AK10
Dec 29 '18 at 9:04

I tried to add var ans =15- x/2 + 40-y + 10-z after last if condition....but it is not working....I don't have enough knowledge of JavaScript..... So, can you please edit your code according to my question and give me the full answer..............thanks in advance....

– Sparsh Goyal
Dec 29 '18 at 12:59

add a comment |

Where I have to add rest of the logic??? Please tell me through a complete HTML code....

– Sparsh Goyal
Dec 29 '18 at 5:15

just add your logic in the corrector function after the last if condition

– AK10
Dec 29 '18 at 9:02

Like var ans = 15 - x/2 + 40-y + 10-z

– AK10
Dec 29 '18 at 9:04

I tried to add var ans =15- x/2 + 40-y + 10-z after last if condition....but it is not working....I don't have enough knowledge of JavaScript..... So, can you please edit your code according to my question and give me the full answer..............thanks in advance....

– Sparsh Goyal
Dec 29 '18 at 12:59

Where I have to add rest of the logic??? Please tell me through a complete HTML code....

– Sparsh Goyal
Dec 29 '18 at 5:15

just add your logic in the corrector function after the last if condition

– AK10
Dec 29 '18 at 9:02

Like var ans = 15 - x/2 + 40-y + 10-z

– AK10
Dec 29 '18 at 9:04

I tried to add var ans =15- x/2 + 40-y + 10-z after last if condition....but it is not working....I don't have enough knowledge of JavaScript..... So, can you please edit your code according to my question and give me the full answer..............thanks in advance....

– Sparsh Goyal
Dec 29 '18 at 12:59

add a comment |

It helps to separate out your code from your markup - I moved the onclick logic to a calculate function which does the validation you want. I also simplified your math.

function calculate() {

  const defaults = {PE: 7, ROCE: 5, SG: 4};

  const values = {};

  Object.keys(defaults).forEach(id => {

    const el = document.getElementById(id);

    if (el.value < 0) {

      el.value = defaults[id];

    }

    values[id] = el.value;

  });

  document.getElementsByName('amount')[0].value = 65 - values.PE/2 - values.ROCE - values.SG

}

<HTML>

<head><title>Calculation</title>

</head>

<body>

<form>

  PE Ratio

    <input type="number" min="0" id="PE" /><br>

    

  ROCE  

    <input type="number" id="ROCE" /><br>

   

  Sales Growth 

     <input type="number" id="SG" /> <br> 

    

   <input type="button" Value="Multiply" style="height: 30px; width: 150px; left: 250; top: 250;"    onsubmit="return false"  onclick="calculate()">

  

   <p>Rating: <div id="div1">

   <strong><output name="amount" for="hours rate vat">0</output></strong></div>

   </p>

     </form>

</body>

</HTML>

edited Dec 28 '18 at 20:43

answered Dec 28 '18 at 20:25

ic3b3rg

10.7k41945

I think you have an error. You should compare input value with 0 and use default if it's less then 0.

– mx0
Dec 28 '18 at 20:42

thanks! adjusted

– ic3b3rg
Dec 28 '18 at 20:43

Your code is working well....but my formula or logic for calculating sum was different...and you used a complete different method....I tried to change your logic as per my convince, but after that code is giving very different output....please edit your code and make sure the logic remain same...

– Sparsh Goyal
Dec 29 '18 at 5:43

thanks! the formula reduces to what I've used

– ic3b3rg
Dec 29 '18 at 5:45

add a comment |

It helps to separate out your code from your markup - I moved the onclick logic to a calculate function which does the validation you want. I also simplified your math.

function calculate() {

  const defaults = {PE: 7, ROCE: 5, SG: 4};

  const values = {};

  Object.keys(defaults).forEach(id => {

    const el = document.getElementById(id);

    if (el.value < 0) {

      el.value = defaults[id];

    }

    values[id] = el.value;

  });

  document.getElementsByName('amount')[0].value = 65 - values.PE/2 - values.ROCE - values.SG

}

<HTML>

<head><title>Calculation</title>

</head>

<body>

<form>

  PE Ratio

    <input type="number" min="0" id="PE" /><br>

    

  ROCE  

    <input type="number" id="ROCE" /><br>

   

  Sales Growth 

     <input type="number" id="SG" /> <br> 

    

   <input type="button" Value="Multiply" style="height: 30px; width: 150px; left: 250; top: 250;"    onsubmit="return false"  onclick="calculate()">

  

   <p>Rating: <div id="div1">

   <strong><output name="amount" for="hours rate vat">0</output></strong></div>

   </p>

     </form>

</body>

</HTML>

edited Dec 28 '18 at 20:43

answered Dec 28 '18 at 20:25

ic3b3rg

10.7k41945

I think you have an error. You should compare input value with 0 and use default if it's less then 0.

– mx0
Dec 28 '18 at 20:42

thanks! adjusted

– ic3b3rg
Dec 28 '18 at 20:43

Your code is working well....but my formula or logic for calculating sum was different...and you used a complete different method....I tried to change your logic as per my convince, but after that code is giving very different output....please edit your code and make sure the logic remain same...

– Sparsh Goyal
Dec 29 '18 at 5:43

thanks! the formula reduces to what I've used

– ic3b3rg
Dec 29 '18 at 5:45

add a comment |

It helps to separate out your code from your markup - I moved the onclick logic to a calculate function which does the validation you want. I also simplified your math.

function calculate() {

  const defaults = {PE: 7, ROCE: 5, SG: 4};

  const values = {};

  Object.keys(defaults).forEach(id => {

    const el = document.getElementById(id);

    if (el.value < 0) {

      el.value = defaults[id];

    }

    values[id] = el.value;

  });

  document.getElementsByName('amount')[0].value = 65 - values.PE/2 - values.ROCE - values.SG

}

<HTML>

<head><title>Calculation</title>

</head>

<body>

<form>

  PE Ratio

    <input type="number" min="0" id="PE" /><br>

    

  ROCE  

    <input type="number" id="ROCE" /><br>

   

  Sales Growth 

     <input type="number" id="SG" /> <br> 

    

   <input type="button" Value="Multiply" style="height: 30px; width: 150px; left: 250; top: 250;"    onsubmit="return false"  onclick="calculate()">

  

   <p>Rating: <div id="div1">

   <strong><output name="amount" for="hours rate vat">0</output></strong></div>

   </p>

     </form>

</body>

</HTML>

edited Dec 28 '18 at 20:43

answered Dec 28 '18 at 20:25

ic3b3rg

10.7k41945

It helps to separate out your code from your markup - I moved the onclick logic to a calculate function which does the validation you want. I also simplified your math.

function calculate() {

  const defaults = {PE: 7, ROCE: 5, SG: 4};

  const values = {};

  Object.keys(defaults).forEach(id => {

    const el = document.getElementById(id);

    if (el.value < 0) {

      el.value = defaults[id];

    }

    values[id] = el.value;

  });

  document.getElementsByName('amount')[0].value = 65 - values.PE/2 - values.ROCE - values.SG

}

<HTML>

<head><title>Calculation</title>

</head>

<body>

<form>

  PE Ratio

    <input type="number" min="0" id="PE" /><br>

    

  ROCE  

    <input type="number" id="ROCE" /><br>

   

  Sales Growth 

     <input type="number" id="SG" /> <br> 

    

   <input type="button" Value="Multiply" style="height: 30px; width: 150px; left: 250; top: 250;"    onsubmit="return false"  onclick="calculate()">

  

   <p>Rating: <div id="div1">

   <strong><output name="amount" for="hours rate vat">0</output></strong></div>

   </p>

     </form>

</body>

</HTML>

function calculate() {

  const defaults = {PE: 7, ROCE: 5, SG: 4};

  const values = {};

  Object.keys(defaults).forEach(id => {

    const el = document.getElementById(id);

    if (el.value < 0) {

      el.value = defaults[id];

    }

    values[id] = el.value;

  });

  document.getElementsByName('amount')[0].value = 65 - values.PE/2 - values.ROCE - values.SG

}

<HTML>

<head><title>Calculation</title>

</head>

<body>

<form>

  PE Ratio

    <input type="number" min="0" id="PE" /><br>

    

  ROCE  

    <input type="number" id="ROCE" /><br>

   

  Sales Growth 

     <input type="number" id="SG" /> <br> 

    

   <input type="button" Value="Multiply" style="height: 30px; width: 150px; left: 250; top: 250;"    onsubmit="return false"  onclick="calculate()">

  

   <p>Rating: <div id="div1">

   <strong><output name="amount" for="hours rate vat">0</output></strong></div>

   </p>

     </form>

</body>

</HTML>

function calculate() {

  const defaults = {PE: 7, ROCE: 5, SG: 4};

  const values = {};

  Object.keys(defaults).forEach(id => {

    const el = document.getElementById(id);

    if (el.value < 0) {

      el.value = defaults[id];

    }

    values[id] = el.value;

  });

  document.getElementsByName('amount')[0].value = 65 - values.PE/2 - values.ROCE - values.SG

}

<HTML>

<head><title>Calculation</title>

</head>

<body>

<form>

  PE Ratio

    <input type="number" min="0" id="PE" /><br>

    

  ROCE  

    <input type="number" id="ROCE" /><br>

   

  Sales Growth 

     <input type="number" id="SG" /> <br> 

    

   <input type="button" Value="Multiply" style="height: 30px; width: 150px; left: 250; top: 250;"    onsubmit="return false"  onclick="calculate()">

  

   <p>Rating: <div id="div1">

   <strong><output name="amount" for="hours rate vat">0</output></strong></div>

   </p>

     </form>

</body>

</HTML>

edited Dec 28 '18 at 20:43

answered Dec 28 '18 at 20:25

ic3b3rg

10.7k41945

edited Dec 28 '18 at 20:43

answered Dec 28 '18 at 20:25

ic3b3rg

10.7k41945

answered Dec 28 '18 at 20:25

ic3b3rg

10.7k41945

answered Dec 28 '18 at 20:25

ic3b3rg

10.7k41945

I think you have an error. You should compare input value with 0 and use default if it's less then 0.

– mx0
Dec 28 '18 at 20:42

thanks! adjusted

– ic3b3rg
Dec 28 '18 at 20:43

Your code is working well....but my formula or logic for calculating sum was different...and you used a complete different method....I tried to change your logic as per my convince, but after that code is giving very different output....please edit your code and make sure the logic remain same...

– Sparsh Goyal
Dec 29 '18 at 5:43

thanks! the formula reduces to what I've used

– ic3b3rg
Dec 29 '18 at 5:45

add a comment |

I think you have an error. You should compare input value with 0 and use default if it's less then 0.

– mx0
Dec 28 '18 at 20:42

thanks! adjusted

– ic3b3rg
Dec 28 '18 at 20:43

Your code is working well....but my formula or logic for calculating sum was different...and you used a complete different method....I tried to change your logic as per my convince, but after that code is giving very different output....please edit your code and make sure the logic remain same...

– Sparsh Goyal
Dec 29 '18 at 5:43

thanks! the formula reduces to what I've used

– ic3b3rg
Dec 29 '18 at 5:45

I think you have an error. You should compare input value with 0 and use default if it's less then 0.

– mx0
Dec 28 '18 at 20:42

thanks! adjusted

– ic3b3rg
Dec 28 '18 at 20:43

Your code is working well....but my formula or logic for calculating sum was different...and you used a complete different method....I tried to change your logic as per my convince, but after that code is giving very different output....please edit your code and make sure the logic remain same...

– Sparsh Goyal
Dec 29 '18 at 5:43

thanks! the formula reduces to what I've used

– ic3b3rg
Dec 29 '18 at 5:45

add a comment |

I made it so that you can just copy & paste the code into one script.

If something doesn't work the way you want to. Let me know.

<HTML>



<head>

  <title>Calculation</title>

</head>



<body>



  PE Ratio <input type="number" id="PE" /><br> ROCE <input type="number" id="ROCE" /><br> Sales Growth <input type="number" id="SG" /> <br>



  <button onsubmit="return false" onclick="Multiply()" style="height: 30px; width: 150px; left: 250; top: 250;" onsubmit="return false">Multiply</button>



  <p>Rating</p>

  <b id="output">0</b>

</body>

<script>

  var output = document.getElementById("output");



  function Multiply() {



    var a = isNaN(PE.valueAsNumber) ? 7 : PE.valueAsNumber;

    var b = isNaN(ROCE.valueAsNumber) ? 5 : ROCE.valueAsNumber;

    var c = isNaN(SG.valueAsNumber) ? 4 : SG.valueAsNumber;



    if (PE.valueAsNumber < 0 || SG.valueAsNumber < 0 || ROCE.valueAsNumber < 0)

      output.innerHTML = "No negetive numbers"

    else

      output.innerHTML = 15 - a / 2 + 40 - b + 10 - c;

  }

</script>



</HTML>

edited Dec 29 '18 at 7:55

answered Dec 28 '18 at 20:39

Vincent

627

I want to change input values with default one.....don't want to show message...

– Sparsh Goyal
Dec 29 '18 at 5:41

I changed the code, but I wasn't quite sure what you needed. I deleted the value in the input fields but made it so if you leave the input fields blank it would still use the default value.

– Vincent
Dec 29 '18 at 7:50

add a comment |

I made it so that you can just copy & paste the code into one script.

If something doesn't work the way you want to. Let me know.

<HTML>



<head>

  <title>Calculation</title>

</head>



<body>



  PE Ratio <input type="number" id="PE" /><br> ROCE <input type="number" id="ROCE" /><br> Sales Growth <input type="number" id="SG" /> <br>



  <button onsubmit="return false" onclick="Multiply()" style="height: 30px; width: 150px; left: 250; top: 250;" onsubmit="return false">Multiply</button>



  <p>Rating</p>

  <b id="output">0</b>

</body>

<script>

  var output = document.getElementById("output");



  function Multiply() {



    var a = isNaN(PE.valueAsNumber) ? 7 : PE.valueAsNumber;

    var b = isNaN(ROCE.valueAsNumber) ? 5 : ROCE.valueAsNumber;

    var c = isNaN(SG.valueAsNumber) ? 4 : SG.valueAsNumber;



    if (PE.valueAsNumber < 0 || SG.valueAsNumber < 0 || ROCE.valueAsNumber < 0)

      output.innerHTML = "No negetive numbers"

    else

      output.innerHTML = 15 - a / 2 + 40 - b + 10 - c;

  }

</script>



</HTML>

edited Dec 29 '18 at 7:55

answered Dec 28 '18 at 20:39

Vincent

627

I want to change input values with default one.....don't want to show message...

– Sparsh Goyal
Dec 29 '18 at 5:41

I changed the code, but I wasn't quite sure what you needed. I deleted the value in the input fields but made it so if you leave the input fields blank it would still use the default value.

– Vincent
Dec 29 '18 at 7:50

add a comment |

I made it so that you can just copy & paste the code into one script.

If something doesn't work the way you want to. Let me know.

<HTML>



<head>

  <title>Calculation</title>

</head>



<body>



  PE Ratio <input type="number" id="PE" /><br> ROCE <input type="number" id="ROCE" /><br> Sales Growth <input type="number" id="SG" /> <br>



  <button onsubmit="return false" onclick="Multiply()" style="height: 30px; width: 150px; left: 250; top: 250;" onsubmit="return false">Multiply</button>



  <p>Rating</p>

  <b id="output">0</b>

</body>

<script>

  var output = document.getElementById("output");



  function Multiply() {



    var a = isNaN(PE.valueAsNumber) ? 7 : PE.valueAsNumber;

    var b = isNaN(ROCE.valueAsNumber) ? 5 : ROCE.valueAsNumber;

    var c = isNaN(SG.valueAsNumber) ? 4 : SG.valueAsNumber;



    if (PE.valueAsNumber < 0 || SG.valueAsNumber < 0 || ROCE.valueAsNumber < 0)

      output.innerHTML = "No negetive numbers"

    else

      output.innerHTML = 15 - a / 2 + 40 - b + 10 - c;

  }

</script>



</HTML>

edited Dec 29 '18 at 7:55

answered Dec 28 '18 at 20:39

Vincent

627

I made it so that you can just copy & paste the code into one script.

If something doesn't work the way you want to. Let me know.

<HTML>



<head>

  <title>Calculation</title>

</head>



<body>



  PE Ratio <input type="number" id="PE" /><br> ROCE <input type="number" id="ROCE" /><br> Sales Growth <input type="number" id="SG" /> <br>



  <button onsubmit="return false" onclick="Multiply()" style="height: 30px; width: 150px; left: 250; top: 250;" onsubmit="return false">Multiply</button>



  <p>Rating</p>

  <b id="output">0</b>

</body>

<script>

  var output = document.getElementById("output");



  function Multiply() {



    var a = isNaN(PE.valueAsNumber) ? 7 : PE.valueAsNumber;

    var b = isNaN(ROCE.valueAsNumber) ? 5 : ROCE.valueAsNumber;

    var c = isNaN(SG.valueAsNumber) ? 4 : SG.valueAsNumber;



    if (PE.valueAsNumber < 0 || SG.valueAsNumber < 0 || ROCE.valueAsNumber < 0)

      output.innerHTML = "No negetive numbers"

    else

      output.innerHTML = 15 - a / 2 + 40 - b + 10 - c;

  }

</script>



</HTML>

<HTML>



<head>

  <title>Calculation</title>

</head>



<body>



  PE Ratio <input type="number" id="PE" /><br> ROCE <input type="number" id="ROCE" /><br> Sales Growth <input type="number" id="SG" /> <br>



  <button onsubmit="return false" onclick="Multiply()" style="height: 30px; width: 150px; left: 250; top: 250;" onsubmit="return false">Multiply</button>



  <p>Rating</p>

  <b id="output">0</b>

</body>

<script>

  var output = document.getElementById("output");



  function Multiply() {



    var a = isNaN(PE.valueAsNumber) ? 7 : PE.valueAsNumber;

    var b = isNaN(ROCE.valueAsNumber) ? 5 : ROCE.valueAsNumber;

    var c = isNaN(SG.valueAsNumber) ? 4 : SG.valueAsNumber;



    if (PE.valueAsNumber < 0 || SG.valueAsNumber < 0 || ROCE.valueAsNumber < 0)

      output.innerHTML = "No negetive numbers"

    else

      output.innerHTML = 15 - a / 2 + 40 - b + 10 - c;

  }

</script>



</HTML>

<HTML>



<head>

  <title>Calculation</title>

</head>



<body>



  PE Ratio <input type="number" id="PE" /><br> ROCE <input type="number" id="ROCE" /><br> Sales Growth <input type="number" id="SG" /> <br>



  <button onsubmit="return false" onclick="Multiply()" style="height: 30px; width: 150px; left: 250; top: 250;" onsubmit="return false">Multiply</button>



  <p>Rating</p>

  <b id="output">0</b>

</body>

<script>

  var output = document.getElementById("output");



  function Multiply() {



    var a = isNaN(PE.valueAsNumber) ? 7 : PE.valueAsNumber;

    var b = isNaN(ROCE.valueAsNumber) ? 5 : ROCE.valueAsNumber;

    var c = isNaN(SG.valueAsNumber) ? 4 : SG.valueAsNumber;



    if (PE.valueAsNumber < 0 || SG.valueAsNumber < 0 || ROCE.valueAsNumber < 0)

      output.innerHTML = "No negetive numbers"

    else

      output.innerHTML = 15 - a / 2 + 40 - b + 10 - c;

  }

</script>



</HTML>

edited Dec 29 '18 at 7:55

answered Dec 28 '18 at 20:39

Vincent

627

edited Dec 29 '18 at 7:55

answered Dec 28 '18 at 20:39

Vincent

627

answered Dec 28 '18 at 20:39

Vincent

627

answered Dec 28 '18 at 20:39

Vincent

627

I want to change input values with default one.....don't want to show message...

– Sparsh Goyal
Dec 29 '18 at 5:41

I changed the code, but I wasn't quite sure what you needed. I deleted the value in the input fields but made it so if you leave the input fields blank it would still use the default value.

– Vincent
Dec 29 '18 at 7:50

add a comment |

I want to change input values with default one.....don't want to show message...

– Sparsh Goyal
Dec 29 '18 at 5:41

I changed the code, but I wasn't quite sure what you needed. I deleted the value in the input fields but made it so if you leave the input fields blank it would still use the default value.

– Vincent
Dec 29 '18 at 7:50

I want to change input values with default one.....don't want to show message...

– Sparsh Goyal
Dec 29 '18 at 5:41

I changed the code, but I wasn't quite sure what you needed. I deleted the value in the input fields but made it so if you leave the input fields blank it would still use the default value.

– Vincent
Dec 29 '18 at 7:50

add a comment |

draft saved

draft discarded

Thanks for contributing an answer to Stack Overflow!

Please be sure to answer the question. Provide details and share your research!

But avoid …

Asking for help, clarification, or responding to other answers.

Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Name

Required, but never shown

Name

Required, but never shown

This page is only for reference, If you need detailed information, please check here

搜尋此網誌

Bdtjtk