I'm trying to pull a dynamic page value as a JS VAR. It returns NaN. Not sure why.
function calculate(inputString) {
var tendered=inputString;
var curTotal=document.getElementById("total2");
x=tendered-curTotal;
y=(Math.round(x * 100) / 100).toFixed(2);
if (y > 0) $(".submit").show();
if (y < 0) {
y="<font color='red'>Customer Still OWES: ".concat(y.replace('-','')).concat("</font>");
$(".submit").hide();
}
$('#change').html(y);
document.getElementById('changeowed').value = y;
}
The function is called onkeyup entering the amount tendered.
HTML:
<div class="overlay">
<div class="border">
<div class="cashform">
<center>
<h1>Cash Payment</h1><br>
<form name="cash" action="sale.php" method="post">
<h2>Amount Due: <font color="green"><b><div id="total2"></div></b></font></h2>
<h2>Amount Tendered: <input type="text" id="tendered" name="tendered" size="10" onkeyup="calculate(this.value)"></h2>
<h2>Change Owed<font color="green"><b><div id="change"></div></b></font></h2>
<br><br><br>
<input type="hidden" name="action" value="cash" />
<input type="hidden" name="total" value="<?php echo $total; ?>" />
<input type="hidden" id="changeowed" name="changeowed" />
<input type="hidden" name="sid" value="<?php echo $sid; ?>" />
<input type="submit" name="submit" value="Submit" class="submit"> || <input type="button" value="Cancel" class="cancel">
</form>
</center>
</div>
</div>
I have tried with the JS above and below the HTML.
I say the value (element) is dynamic because it changes based on the transaction (page is not reloaded when scanning items into the sale or deleting items from the sale). Adding or deleting items to or from the sale calls a JS POST function.
document.getElementById("total2") returns an DOM object. Thus, curTotal is an object.
Therefore, tendered - curTotal is a string minus an object, which yields NaN. The string might be able to be coerced into a number, but the DOM object definitely cannot.
Perhaps you meant to do document.getElementById("total2").value (assuming #total2 is an input element), which would make tendered - curTotal a string minus a string, which is more likely to succeed.
(As a best practice, you should convert your numerical input to numbers; e.g., parseInt(inputString, 10) or parseFloat(inputString, 10).)
Related
So, here's the form
<form action="/missions/basic/3/index.php" method="post">
<input type="hidden" name="file" value="password.php" />
<input type="password" name="password" /><br /><br />
<input type="submit" value="submit" />
<input type=button value="Get Value" onclick="printIt()" /></form>
I have these methods here to try to get the value to appear.
function printIt(){
for (i = 0; i < document.getElementsByName('password').length; i++) {
var x = window.alert(document.getElementsByName('password')[i].value());
window.alert(x);
}
}
I want to know what I can change in those last two methods to get the value to appear.
The function document.getElementsByTagName() returns an array, not one element, so changing your code to window.alert(document.getElementsByName('password')[0].value); should get the first item's value. The first item will most likely be the element in your form you're looking for.
I am having an issue with a bit of code in a form. I am trying to get the value from the user (dollar amount) and parse it to an integer. Then I need to perform calculations to add 2.9% to it and also add .30 to the product.
It seems that the issue is in the parsing...because I am getting errors in the console saying $sendAmount.val is not a function [when I enter $sendAmount.val()]. Yet, if I submit $userAmount.val(), it returns the dollar amount the user submitted (in a string).
Keep in mind that $userAmount is what the user enters and
$sendAmount is what is sent to Paypal.
Any help with this would be most appreciated... I have been trying to get this to work and have been coming up empty. I don't have much experience with parseInt.
Here is my code:
var $sendAmount = $("#payAMT");
var $userAmount = $("#valInput");
//Update the Amount
function $convFee() {
$sendAmount = parseInt($userAmount) * 1.029 + 0.30;
};
$agree.keyup($convFee);
$agree.click($convFee);
<div id="paypalWrap">
<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="new">
<input type="hidden" name="amount" id="payAMT" value="0.00">
<input type="hidden" name="currency_code" value="USD">
<p>
<label for="os0" type="hidden" name="on0" value="Name:">Name:</label>
<input type="text" name="os0" maxlength="30" id="name">
</p>
<p>
<label for="os1" type="hidden" name="on1" value="Invoice Number:">Invoice Number:
<br />
<i>(Reference must be correct to get credit applied to your account)</i>
</label>
<input type="text" name="os1" maxlength="50" id="invoice">
</p>
<p>
<label for="os2" type="hidden" name="on2" value="Amount:">Amount being paid:</label>
<input type="text" name="os2" id="valInput" maxlength="15" placeholder="ex: 10.00 (not $10.00)">
</p>
<p>
<input type="checkbox" name "agreeCheck" id="agreeCheck" />
<label for="agreeCheck" type="hidden" name="agreeStatement" id="agreeStatement">
I understand and accept that I will be charged a convenience fee ($0.30 + 2.9% of transaction).
</label>
</p>
<input id="send" type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_paynowCC_LG.gif" disabled="disabled" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
</form>
</div>
This line has the same problem twice:
$sendAmount = parseInt($userAmount) * 1.029 + 0.30;
Both of these variables are DOM elements, not numbers. You need to interact with them as items, specifically their value elements (which are strings that can be parsed to numbers).
You need to retrieve the value from the first, and set the value of the second, e.g.:
$sendAmount.val(parseInt($userAmount.val) * 1.029 + 0.30);
See http://api.jquery.com/val/
this is my JS code to check the match of two digits
<script type="text/javascript">
function match(){
var a=parseInt(document.getElementById("one"));
var b=parseInt(document.getElementById("two"));
var c=parseInt(document.getElementById("sum"));
var d;
d=a+b;
if(d!=c)
{
alert("Something is wrong!!");
}
else
{
alert ("Success");
}
}
</script>
html code for generat two digits and check on the process.
<form action="#" method="post" onsubmit="return match();">
<input type="text" name="one" id="one" value="<?php echo rand(1,9); ?>" readonly="readonly"/>
+
<input type="text" name="two" id="two" value="<?php echo rand(1,9); ?>" readonly="readonly"/>
=
<input type="text" name="sum" id="sum" />
<input type="submit" value="submit" />
</form>
Perhaps you want their value and not the element itself.
var a=parseInt(document.getElementById("one").value,10);
var b=parseInt(document.getElementById("two").value,10);
var c=parseInt(document.getElementById("sum").value,10);
Also, provide the radix when you are using parseInt() otherwise it may go crazy sometimes.
I'm having an issue with passing hidden values. I have a search field that onclick calls my javascript function with the intention of setting a hidden fields value further down the page.
<div class="search">
<input type="text" name="username" class="mySearch" value="">
<input type="button" class="myButton" value="" onclick="setSearch();">
</div>
My javascript, i is set outside of the function.
setSearch(){
if(i == 0){
$('input:hidden[name="search1"]').val($(".mySearch").val());
}
else if(i == 1)
{
$('input:hidden[name="search2"]').val($(".mySearch").val());
}
i++;
}
and then the field I'm try to set
<div class="sendallHolder">
<form method="post" action="getTweets.php">
<input type="hidden" name="fromTest" id="fromTest"/>
<input type="hidden" name="untilTest" id="untilTest"/>
<input type="hidden" name="latTest" id="latTest"/>
<input type="hidden" name="longTest" id="longTest"/>
<input type="hidden" name="search1" id="search1" />
<input type="hidden" name="search2" id="search2" />
<input type="submit" class="sendAll" value="Gather News!">
</form>
</div>
It runs through the loop twice but each time its not setting the values properly in my hidden fields. the dev tools in chrome tell me that the 'value' is popping up but no value is being set. I'm not entirely sure what I'm doing wrong.
Any ideas?
The :hidden selector doesn't do what you think. It matches elements that have been hidden using CSS, it doesn't match type="hidden" inputs. Just use
$("#search1")
since you have an id on the elements.
Use hidden input ID like this :
$('#search1').val($(".mySearch").val())
$(".mySearch").keyup(addhjc);
function addhjc(){
$('#search2').val($(".mySearch").val());
}
or
$('.myButton').click(function(){
$('#search2').val($(".mySearch").val());
});
also
function setSearch(){
if(i === 0){........
and define i var
I'm trying to validate a form filed via javascript. The idea is that the form filed has a set list of accepted values and only these values work. So if the field is black it will alert that the ID is incorrect. If the field has input which is not in the list it will display that ID is incorrect. I have gotten close. I just need a little more direction.
Here is my code:
script type="text/javascript">
function validateForm()
{
var x=document.forms["dispatch"]["ID1"].value;
var arr=["CA238", "Pete", "John"];
if x==(.inArray(inputVal, arr) > -1)
{
alert("Correct Dispatcher ID Required");
return false;
}
}
</script>
<form id="form_242533" class="appnitro" name="dispatch" onsubmit="return validateForm()" method="post" action="<?php echo $_SERVER["PHP_SELF"]?>">
<li id="li_9" >
<label class="description" for="element_1">Dispatch ID</label>
<div>
<input id="element_1" name="ID1" class="element text medium" type="text" value=""/> Put your assigned dispatcher ID
</div>
</li>
<li class="buttons">
<input type="hidden" name="Submit" value="Submit" />
<input id="submit" class="button_text" type="submit" name="submit" value="Submit" />
<input type="reset" />
</li>
</ul>
</form>
Change this:
if x==(.inArray(inputVal, arr) > -1)
to this:
if ($.inArray(x, arr) == -1)
if you're using jQuery.
If you don't have jQuery on the page, change it to this instead:
if (arr.indexOf(x) == -1)
Note however, that this method won't work in IE < 9. Use the polyfill provided here to add indexOf support to older versions of IE.