Before you says its duplicate, I am not asking how to actually format the price. But asking where I am doing it wrong or what else I should do to implement it the way I want.
I did the price formatting ( actually by copying the code from somewhere )
http://jsfiddle.net/qwY24/
like for price 1
but now I want to format the price in the input field itself (price 2), it work fine till 6 digit but then after that it get messed up. It got two problem
Format messed up after 6 digit
when press back key(delete number) the price doesn't reformat after 6 digit only
Code
$(".price1").on("keyup",function(){
var price = $(this).val();
$(".formatted1").text(price.toString().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,"));
});
$(".price2").on("keyup",function(){
var price = $(this).val();
price = price.replace(",","");
$(".price2").val(price.toString().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,"));
$(".formatted2").text(price.toString().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,"));
});
<label>Price 1</label>
<input type="text" class="price1" /><br />
<label><b>Price 1 Formatted:</b></label>
<span class="formatted1"></span><br /><br /><br />
<label>Price 2</label>
<input type="text" class="price2" /><br />
<label><b>Price 2 Formatted</b></label>
<span class="formatted2" ></span><br /><br /><br />
price.replace(",","") replaces only the first instance of comma, not all of them. Replace it with
price = price.replace(/,/g,"");
(Also, the .toString() part in the next line is unnecessary because the variable is already a string.)
Demo: http://jsfiddle.net/qwY24/3/
Related
The HTML looks like this:
<div>
<label class="sr-only" for="product">Product</label>
<input id="product" type="text" placeholder="Product" maxlength="7" autofocus>
<label class="sr-only" for="batch">Batch</label>
<input id="batch" type="text" placeholder="Batch" maxlength="5">
</div>
The jQuery looks like this:
$('#product').on('keyup', function() {
let product = $(this).val().slice(0, 7);
let batch = $(this).val().slice(9, 14);
if ($(this).val() && $(this).val().length === 7) {
$(this).val(product);
$(this).next().focus().val(batch);
}
});
When I'm scanning the barcode, it reads this string WXYZ519 -8012456789.
I need to slice this string so that the input with id="product" and id="batch" gets the values as WXYZ519 and 80124 respectively without the hyphen and space in between.
The first input does receive the right value but I just couldn't get the second input to slice the right value into it.
Can anyone tell me why and what's wrong with my code?
Your range appears to be wrong if you wanted to get the entire 2nd half of the string.
If you change
$(this).val().slice(9, 14);
to
$(this).val().slice(9, $(this).val().length);
it will contain a string that starts at 9 and ends at the end of the string.
Another alternative which I believe is much cleaner and less error prone would be this:
let split = $(this).val().split(" -");
let product = split[0];
let batch = split[1];
Here's a script, that will add all the Float values entered in input fields. But I am getting a problem at ROUNDING THE VALUE. With my script, Value before decimal point is rounding off after 0.99(like Price of an item). but I want to round off the value after 0.59(like minutes).
When the Calculate button is clicked, the value will be displayed in another input field.
function add_number() {
var first = parseFloat(document.getElementById("sunday").value);
var second = parseFloat(document.getElementById("monday").value);
var third = parseFloat(document.getElementById("tuesday").value);
var forth = parseFloat(document.getElementById("wednesday").value);
var fifth = parseFloat(document.getElementById("thursday").value);
var sixth = parseFloat(document.getElementById("friday").value);
var seventh = parseFloat(document.getElementById("saturday").value);
var rsl = first + second + third + forth + fifth + sixth + seventh;
document.getElementById("txtresult").value = rsl.toFixed(2);
}
<input type="number" name="sunhrs" id="sunday" />
<input type="number" name="monhrs" id="monday" />
<input type="number" name="tuesday" id="tuesday" />
<input type="number" name="wedhrs" id="wednesday" />
<input type="number" name="thurshrs" id="thursday" />
<input type="number" name="frihrs" id="friday" />
<input type="number" name="sathrs" id="saturday" />
<button onclick="add_number()">Calculate</button>
<br>
<br>
<input type="number" name="txtresult" id="txtresult" />
Example: If I entered 1.50,1.50 in input fields and click on calculate button the output will be 3.00 as the value is rounded off after 0.99. but i want the value rounded after 0.59 So, that the output will be 3.40.
Thanks in advance.
EDITED: The first problem in the post (it was befaore I change); the word "result" is special for JavaScript and I have not use it for a variable name.
Secondly, forgot to add element which has an id is txtresult
;) thx your attention.
In order to add these values together the way you want, you'll need to convert your inputs to fractional hours, and then convert back from fractional hours to the desired representation. JavaScript does not have an "hours" data structure built in. The JavaScript Number type has a decimal base, so it can only work like regular decimal numbers.
e.g.
var first = hoursFromString(document.getElementById("sunday").value);
//etc.
then
document.getElementById("txtresult").value = stringFromHours(result);
If you need help writing hoursFromString or stringFromHours, please update your question with more information on the part you're having trouble with.
Ok, all, I have a few questions.
How can I have my total have a $ and how can I move up next to the word Total: ( so it will be side by side)
Once I get a total price, is there a way where I can divide it by 2 to get 1/2 of the price into another field called 'deposit' before copying that to add to another field called 'balance':
I cannot get the date fields to copy
To note this is where I found how to add up the radio buttons ( Here)
This is what I have so far.
This is my form:
Session Date: <input type="text" name="field1" id="f1" />
Session Type payment :
<input type="radio" name="sessiontypepayment" id="sessiontypepayment1" value="100.00" onclick="FnCalculate(this,'extrapeople');"> Mini Session $100.00
<input type="radio" name="sessiontypepayment" id="sessiontypepayment2" value="250.00" onclick="FnCalculate(this,'extrapeople');"> Full Session $250.00
Extra people :
<input type="radio" name="extrapeople" id="extrapeople1" value="25.00" onclick="FnCalculate(this,'sessiontypepayment');"> 1 person $25.00
<input type="radio" name="extrapeople" id="extrapeople2" value="50.00" onclick="FnCalculate(this,'sessiontypepayment');"> 2 people $50.00
<input type="radio" name="extrapeople" id="extrapeople3" value="75.00" onclick="FnCalculate(this,'sessiontypepayment');"> 3 people $75.00
<input type="radio" name="extrapeople" id="extrapeople4" value="100.00" onclick="FnCalculate(this,'sessiontypepayment');"> 4 people $100.00
Total Amount: <div id="total"></div>
Deposit Amount:
Balance Amount:
balance due BY: <input type="text" name="field2" id="f2" />
This is my script what I have so far.
<script type="text/javascript">
$(document).ready(function(){
$("#f1").keyup(function(){
var f2Text = $('#f2').val() + $(this).val();
$('#f2').val(f2Text );
});
});
</script>
<script>
function FnCalculate(id,name)
{
var total=0;
if(document.getElementById(name+"1").checked == true)
{
total = parseInt(document.getElementById(name+"1").value);
}
if(document.getElementById(name+"2").checked == true)
{
total = parseInt(document.getElementById(name+"1").value);
}
total = total + parseInt(id.value);
document.getElementById("total").innerHTML = total;
}
</script>
I would really love help on this please.
First, get rid of all the onclick="FnCalculate(this,'xx');" bits on your inputs.
Then replace your <script>s with this:
<script type="text/javascript">
$(document).ready(function() {
$("#f1").keyup(function() {
$('#f2').val($(this).val());
});
var inputs = $('input[name="sessiontypepayment"], input[name="extrapeople"]');
$(inputs).click(function() {
var total = 0;
$(inputs).filter(':checked').each(function() {
total = total + parseInt($(this).val());
})
$('#total').html('$' + total);
$('#deposit').html('$' + (total / 2));
});
});
</script>
Unsure what you mean by "how can I move up next to the word Total" but I suspect changing <div id="total"></div> to <span id="total"></span> will solve your problem. Either that, or apply some css to the div:
#total {
display: inline;
}
I added the calculation for the deposit, you'll need to add <div id="deposit"></div> to your page somewhere...
You will need jquery. Add this in between <head>...</head>:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
First, you should have your defaults set to checked='checked' for HTML radio buttons that you want checked initially. I would put default text into <div id='total'>$125.00</div>, as well. You might as well use jQuery for what it's made for and not put Events into your HTML at all. .val() returns a String. To cast a String to an integer put + in front of it. To cast to a floating point Number use parseFloat().
$(function(){
$('#f1,[name=sessiontypepayment],[name=extrapeople]').change(function(){
$('#total').text('$'+(parseFloat($('[name=sessiontypepayment]:checked').val())+parseFloat($('[name=extrapeople]:checked').val())).toFixed(2));
$('#f2').val($('#f1').val());
});
});
To divide by 2 it's /2
As a newbie you should get into the practice of using external <script src so it will get cached into your Browser Memory, for faster load time when your Client revisits your site.
I don't what happen with my script can i please point out where is my mistake. 1 to 9 all condition working fine but when you put 10-12 is not work
<form method="post" enctype="multipart/form-data" action="#">
<input type="hidden" value="2" id="itemstock" name="itemstock">
<input value="1" name="quantity" id="quantity" class="text">
<button type="submit" onClick="return checkoption();" >Click </button>
</form>
Javascript
function checkoption()
{
var itemqty = document.getElementById('quantity');
var iss = document.getElementById('itemstock');
if(itemqty.value > iss.value)
{
alert('We have Currently '+iss.value+' In Stock');
}
else
{
alert('add to cart');
}
}
Thank you in advance
Screen short see qty i put 13 but its not showing error
Using the < or > operators with strings will compare the values alphabetically, which is probably not what you want.
You need to compare these as numbers, not as strings. JavaScript allows you to easily cast a string to a number using +, like so:
var qty = +itemqty.value;
var isv = +iss.value;
if(qty > isv)
{
// ...
}
However, you can also use parseInt (which will return NaN if the value is invalid) if you want to add more error checking in your code.
The .value attribute on a text field such as input is a string, not a number. Therefore, you compare strings lexicographically. Change them into numbers, either via parseInt(str, 10) or via +str.
I'm taking data from an encrypted php script which outputs variables as e.g. %%Price%%
Annoyingly those variables are not just a decimal and numeric value.
The encrypted script renders %%Price%% as:
<font color="green"><strong>Sale Price: $2,489.99</strong></font>
I want to strip the value of %%Price%% to price (number and decimal) and then place that result in a hidden form field as the value.
I have tried:
<form id="add-to-cart">
<input type="hidden" name="price" id="price" value=""/>
<button type="submit"> Review & Order</button>
</form>
<script>
var price = "%%Price%%";
var newPrice = price.replace(/[^0-9\.]/g, '');
jQuery("#price").val(newPrice);
</script>
...but this gives an empty result
I would use:
newPrice = parseFloat(price.substring(2, price.length - 3));
I checked your code with a jsfiddle and it seems ok. Check here: http://jsfiddle.net/CmHn6/1/. I actually replaced:
var price = "%%Price%%";
with:
var price = '<font color="green"><strong>Sale Price: $2,489.99</strong></font>';
as you said in your example. Notice that I used single quotes there. If your encrypted script does not take this into account, your line could end up like:
var price = "<font color="green"><strong>Sale Price: $2,489.99</strong></font>";
which would result in a syntax error and would not fill in your input element.
If your string never use single quotes, then you can use single quotes in your code, like in my example.
If not, you could put %%Price%% inside a hidden div, and read this value from there:
<div id="pricediv" display="style: none">%%Price%%</div>
<form id="add-to-cart">
<input type="hidden" name="price" id="price" value=""/>
<button type="submit"> Review & Order</button>
</form>
<script>
var price = $("#pricediv").html();
var newPrice = price.replace(/[^0-9\.]/g, '');
jQuery("#price").val(newPrice);
</script>