I am trying to minus the value of "f1" from "f2" it works fine. However i want it just once but when i click the submit more more button it reduces every time the value of f1 from f2. How can it be done only once. It works well when i put value instead of when i call it from script.
<form name=bills>
<p><input type="text" name="f1" size="20">
<input type="text" name="f2" size="20" value="30"></p>
<input type="button" value="Submit" onclick="cbs(this.form)" name="B1">
<Script>
function cbs(form)
{
form.f2.value = (([document.bills.f2.value] * 1) - (document.bills.f1.value * 1))
}
pls help
The absulute value in math function in JavaScript is Math.abs();
Math.abs(6-10) = 4;
Not sure exactly what you're trying to do, but to calculate absolute value use Math.abs().
If you want the function to only work once, you can have something like this:
hasBeenRun = false; //have this variable outside the function
if(!hasBeenRun) {
hasBeenRun = true;
//Run your code
}
Your question seems to be asking how to only subtract f1 from f2 only once, no matter how many times the submit button is clicked. One way to do it would be to have a variable that tracks if the function has been called already, and don't do the calculation if it has. As for the title mentioning absolute value, this is called by Math.abs(value)
<Script>
var alreadyDone = false;
function cbs(form)
{
if (alreadyDone) return;
// this one takes the absolute value of each value and subtracts them
form.f2.value = (Math.abs(document.bills.f2.value) - Math.abs(document.bills.f1.value));
// this one takes the absolute value of the result of subtracting the two
form.f2.value = (Math.abs(document.bills.f2.value - document.bills.f1.value));
alreadyDone = true;
}
In order to get the function to be able to work again when the value of f1 changes, simply change the variable alreadyDone back to false when f1 changes
<input type="text" name="f1" onChange="alreadyDone=false;" size="20">
Related
I have the following HTML that is within a form, to accept 2 numbers from two separate inputs
<input type="number" id="amount" name="amount" value="0" onchange="ltv()">
<input type="number" id="property_value" name="property_value" value="0" onchange="ltv()">
<p id="ltv"></p>
Then some JavaScript
function ltv() {
var amount = document.getElementById("amount").textContent;
var property_value = document.getElementById("property_value").textContent;
document.getElementById("ltv").innerHTML = Math.round(amount/property_value*100);
};
However after entering a number into the "amount" input the ltv element is updated with NaN which is to be expected at this stage as only the first variable in the math operation is set, however upon entering the second number and tabbing away from the input field the ltv is not updated again.
Seems like textContent isn't returning anything. Try to use .value
function ltv() {
var amount = document.getElementById("amount").value;
var property_value = document.getElementById("property_value").value;
document.getElementById("ltv").innerHTML = Math.round(amount/property_value*100);
};
I have this code:
<input id="InvoiceItemPrice::::" name="InvoiceItemPrice::::" value size="6">
<input id="InvoiceItemPrice::1::" name="InvoiceItemPrice::1::" value="46.00" size="6">
<input id="InvoiceItemPrice::2::" name="InvoiceItemPrice::2::" value="79.00" size="6">,
<input id="InvoiceItemPrice::3::" name="InvoiceItemPrice::3::" value="14.00" size="6">
I like add sum in every value ot input type i have this code:
var sum = 100/123;
$('input[name="InvoiceItemPrice::2::"]').each(function()
{
sum *= parseFloat($(this).val());
});
$('input[name="InvoiceItemPrice::2::"]').val(sum);
How to change all value on all input.
I tried with this $("input [name = ' * InvoiceItemPrice ']") but I caught the first that does not have a value and NaN gives me an error.
What is happening is your sum variable is getting re-used in your each statement, if you change that line inside of your each you should be A-ok.
I have created a jsFiddle here https://jsfiddle.net/r79d3121/3/ which may help
HTML
<input id="InvoiceItemPrice::::" name="InvoiceItemPrice::::" value size="6">
<input id="InvoiceItemPrice::1::" name="InvoiceItemPrice::1::" value="46.00" size="6">
<input id="InvoiceItemPrice::2::" name="InvoiceItemPrice::2::" value="79.00" size="6">,
<input id="InvoiceItemPrice::3::" name="InvoiceItemPrice::3::" value="14.00" size="6">
jQuery
var sum = parseFloat(100 / 123);
$(function () {
var result = 0;
$('[id*="InvoiceItemPrice"]').each(function () {
$(this).val(parseFloat((parseFloat($(this).val()) * parseFloat(sum))));
});
});
Updated to change only the value from the input selected
2nd Update, values are calculated when the document is ready, if you want the values to be updated you could always check for .focusout() on each input and then run the code to calculate the value
3rd Update, the html is back to the original and also, you can just user a partial selector in your jQuery which I have provided and updated the jsFiddle link
Try something like this:
$('input[name^=InvoiceItemPrice]').each(function() {
$(this).val("example");
});
I'm having some trouble with getting Javascript to pass a value (which is stored in local storage) into a textfield. Ideally, I'd like for someone to be able to click the 'apply here' button on one page, have the job number stored in local storage and then have it auto-populate the job number field on my application page with the job number.
This is what I've got so far, I have a feeling that I haven't assigned things correctly.
html (on submit page)
<p>
<form id="applyjob1" action="enquire.html" method="get">
<input type="submit" id="job1" value="Apply for Job" />
</form>
</p>
html (field I'm trying to put data into)
Job Reference Number <input required="required" id="jobNo" name="jobno" type="text" /> </br />
Javascript
window.onload = function init() {
var jobID = document.getElementById("job"); /*button name */
jobID.onsubmit = passJob; /*executes passJob function */
}
function passJob(){
var jobSubmit = localstorage.jobID("1984"); /*assigns localstorage*/
if (jobSubmit != undefined){
document.getElementById("jobNo").value = localstorage.jobID;
}
I think this code would work for your fuction.
function passJob(){
localStorage.setItem("jobID", "1984");
if (localStorage.jobID != undefined) {
document.getElementById("jobNo").value = localStorage.jobID;
}
}
You are assigning the jobSubmit wrongly. To set item, use localStorage.setItem('key', value). Note the casing as it matters.
So basically you should do
var jobSubmit = localStorage.setItem(,"jobID", "1984"); // assigns jobSubmit
And I don't see any element with id="job"
I've typed the whole calculation. I have a submission button which by clicking needs to retrieve the sum. It doesn't work. I'm pretty new at JavaScript so I can't really tell where is the problem. Here is the code:
$('#home_price').submit(function(){
var shutter_price, lights_price, socket_price, screen10_price, screen7_price, dimmer_price, x
var total_price = 3000;
shutter_price = ($('#shutter').val())*200;
light_price = ($('#lights').val())*200;
socket_price = ($('#socket').val())*200;
screen10_price = ($('#screen10').val())*700;
screen7_price = ($('#screen7').val())*200;
dimmer_price = ($('#dimmer').val())*400;
if($('#boiler').is(":checked")==true){
total_price+=600;
x+=1;
}
x+=($('#shutter').val())*2+($('#lights').val())+($('#socket').val());
Math.floor(x);
x+=1;
total_price = total_price + shutter_price + light_price + socket_price + screen10_price + screen7_price + dimmer_price + x*400;
$('#home_pricing').val()=total_price;
if($('#home_pricing').val() < 6000)
alert('the solution invalid');
else
alert(" total: " + $('#home_pricing').val());
});
});
and a piece of the html code:
<label for="screen7"> 7inch screen </label>
<input style="margin-right:70px" name="screen7" type="number" id="screen7"> <br><br>
<label for="dimmer"> dimmer</label>
<input style="margin-right:174px" name="dimmer" type="number" id="dimmer"> <br><br>
<label for="boiler"> bolier </label>
<input style="margin-right:148px" type="checkbox" name="boiler" id="boiler" > <br><br>
<div>
<input type="submit" name=" home_pricing " id="home_pricing" value=" calculate " >
</div>
</form>
I tried doing the same with document.getelementbyid(' one_of the id's').value
but still once I pick values in each input line and then click the submission button it just jumps to the window again with no values and doesn't print anything.
Change the submit button's type from 'submit' to 'button'. That way, clicking submit won't redirect you. What you have to do to set the values though, is make an onclick event for the new button.
Instead of using $('#home_price').submit(), use calculate() and it will work.
The default behavior when a form is submitted to is to to go to a new page. If no new page is specified, the current page is just reloaded. You can prevent that default behavior in the submit event handler method by invoking the event's preventDefault method. To do that, specify an event parameter to the submit method definition, then call preventDefault, like so:
$('#home_price').submit(function(event) {
event.preventDefault();
// Rest of your code here
// ...
Update
There are also a couple of obvious errors in your code. The Math.floor method does not modify the variable passed to it, it returns a integer value. Change this line:
Math.floor(x);
to this
x = Math.floor(x);
Putting the jQuery val() method on the left side of an assignment does do anything. However, you can pass a value to val() and it will set the new value. Change this line:
$('#home_pricing').val()=total_price;
to this:
$('#home_pricing').val(total_price);
I have the following function:
function updateInput(ish){
document.getElementById("BetAmount").value = ish;
}
I have the following HTML inputs:
<input class="defaultText" type="number" name="BetAmount" id="BetAmount" onchange="updateInput(this.value)">
<input type="number" name="PotentialGain" id="PotentialGain" />
When users enter in a bet amount number(BetAmount), I would like to instantly show a calculated PotentialGain, which, for example, can be found by multiplying a constant by the specified bet amount entered in by the user.
I'm not very familiar with JavaScript, so any help is greatly appreciated!
Your code is almost correct - you are showing the result in the BetAmount field so no change is visible.
Change your code to:
document.getElementById("PotentialGain").value = ish;
Here's a working demo. I changed the event to onkeyup as onchange only happens on blur - i.e. when a field loses focus.
Here is the final JQuery function that I used.
function changeBet(bet) {
var moneyline = <?php echo json_encode($win) ?>;
var gain = moneyline * bet;
document.getElementById("PotentialGain").value = gain;
}
Along with these inputs:
<input type="text" name="BetAmount[]" id="BetAmount" onkeyup="changeBet(this.value);" >
<input type="number" name="PotentialGain" id="PotentialGain" />