This question already has answers here:
Number input. HTML
(3 answers)
Closed 3 years ago.
i make the sum between one form to another form and the number entered has a comma. I want to make an alert that cannot be input by letters. how can i do this?
input code
<input id="weight" class="form-control form-control-sm" type="text" name="weight" onkeyup="sum();" required />
<input id="runner" class="form-control form-control-sm" type="text" name="runner" onkeyup="sum();" required />
<input id="gross" class="form-control form-control-sm" type="text" name="gross" value="0" readonly />
this is my script
function sum() {
var txtFirstNumberValue = document.getElementById('weight').value;
var txtSecondNumberValue = document.getElementById('runner').value;
var result = parseFloat(txtFirstNumberValue) + parseFloat(txtSecondNumberValue);
if (!isNaN(result)) {
document.getElementById('gross').value = result;
}
}
Supposing that you are using modern web browser you will only need to do this:
<input id="weight" class="form-control form-control-sm" type="number" name="weight" onkeyup="sum();" required />
type="number" is sufficient.
Related
I want to use a value from the data-validate in some javascript, how can i pick up the minAllowed
<input type="number" name="qty" id="qty" maxlength="12" value="0.5" title="Aantal" class="input-text qty" data-validate="{"required-number":true,"validate-item-quantity":{"minAllowed":0.5,"maxAllowed":10000}}" />
I can get the value like this, is there some way to do the same with minAllowed?
var currentVal = parseInt($(this).parents('form').find('input[name="qty"]').val());
Yes, you can take the value of that attribute by using the data method:
const validate = $('input').data('validate');
const minAllowed = validate['validate-item-quantity'].minAllowed;
console.log(minAllowed);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="number"
name="qty"
id="qty"
maxlength="12"
value="0.5"
title="Aantal"
class="input-text qty"
data-validate="{"required-number":true,"validate-item-quantity":{"minAllowed":0.5,"maxAllowed":10000}}" />
try this:
let validate = $("#qty").data("validate"); // get the value "data-validate"
let minAllowed = validate['validate-item-quantity'].minAllowed; // because the value is json, so you can just call it
console.log(minAllowed);
Try This
var minValue = parseInt(document.getElementById("qty").min)
I have this current if statement - which is inside a for loop:
// Validate Temperatures
if(inputs[i].name.startsWith("actual-temp") || inputs[i].name.startsWith("min-temp") || inputs[i].name.startsWith("max-temp")) {
validate(parseFloat(inputs[i].value), inputs[i], e);
}
What it does
Checks all inputs that has name starting with actual-temp, min-temp and max-temp and passes them into a function called validate
My HTML file
<input type="number" name="max-temp-1">
<input type="number" name="max-temp-1">
<input type="number" name="max-temp-1">
<input type="number" name="min-temp-1">
<input type="number" name="min-temp-1">
<input type="number" name="min-temp-1">
<input type="number" name="actual-temp-1">
<input type="number" name="actual-temp-1">
<input type="number" name="actual-temp-1">
<input type="number" name="max-temp-2">
<input type="number" name="max-temp-2">
<input type="number" name="max-temp-2">
<input type="number" name="min-temp-2">
<input type="number" name="min-temp-2">
<input type="number" name="min-temp-1">
<input type="number" name="actual-temp-2">
<input type="number" name="actual-temp-2">
<input type="number" name="actual-temp-2">
<input type="number" name="max-temp-3">
<input type="number" name="max-temp-3">
<input type="number" name="max-temp-3">
<input type="number" name="min-temp-3">
<input type="number" name="min-temp-3">
<input type="number" name="min-temp-3">
<input type="number" name="actual-temp-3">
<input type="number" name="actual-temp-3">
<input type="number" name="actual-temp-3">
Question
Within my if statement - how can I grab all elements that startsWith() (as it is in the if statement currently) and ends with either -1 or -2? Or alternatively exclude inputs names that end with -3.
You can use regular expressions for your test
if (inputs[i].name.match(/^(actual|min|max)-temp-(1|2)$/)) {
validate(parseFloat(inputs[i].value), inputs[i], e);
}
Use str.includes
if(inputs[i].name.includes("actual-temp") || inputs[i].name.includes("min-temp") || inputs[i].name.includes("max-temp")) {
validate(parseFloat(inputs[i].value), inputs[i], e);
}
for (let item of my_list) {
if (item.charAt(item.length-1)!=="3"&&
(item.startsWith("actual-temp")|| item.startsWith("min-temp")||
item.startsWith("max-temp"))
) {
//logic goes here
}
}
when the first condition in the above if loop fails , javascript will not check the 3 items in OR statements (short circuiting comes into picture)
<form name="myform">
<fieldset>
<legend>Delivery Information</legend>
<p>Country: <input pattern="^[A-Za-z]" type="text" name="textInput" size="25" placeholder="input country..."></p>
<p>Street: <input pattern="^[A-Za-z0-9]" type="text" name="street" size="30" placeholder="input street..."></p>
<p>City: <input pattern="^[A-Za-z ]" type="text" name="textInput" size="20" placeholder="input city..."></p>
<p>Zip: <input pattern="(\d{5}([\-]\d{4})?)" type="text" name="zip" size="5" placeholder="#####"></p>
</fieldset>
</form>
So, I have a form and I want to get all input elements by name "textInput"(I have other inputs so it ha) using Javascrip DOM, and add an attribute "oninvalid="please, only use letters".
Only Javascript, so no JQuery.
You can use this function:
function changeAttributes() {
var x = document.getElementsByName("textInput");
for(var i = 0; i < x.length, i++) {
x[i].setAttribute("oninvalid", "please, only use letters");
}
}
Try below:
$('input[name=textInput]').attr("oninvalid", "please, only use letters");
This question already has answers here:
HTML 5 - number regular expression
(5 answers)
Closed 5 years ago.
Please i have a field that enables user to enter numeric field. Thus,
<input class="form-control input-sm" id="first" name="first" onkeyup="calculate();javascript:checkNumber(this);" $type="text" value="<?php echo (isset($cur)) ? cur->FIRST : 'FIRST' ;?>">$
I want a number limitation let say from 0-30 on that field where by you can type number above 30.
<input class="form-control input-sm" id="first" name="first" onkeyup="calculate();javascript:checkNumber(this);" type="text" value="<?php echo (isset($cur)) ? $cur->FIRST : 'FIRST' ;?>">
With Simple Form and input tag you can do:
<form>
Quantity (between 1 and 30):
<input type="number" name="quantity" min="1" max="30"><br> </form>
This question already has answers here:
compute sum dynamically with javascript
(5 answers)
How get total sum from input box values using Javascript?
(9 answers)
Closed 9 years ago.
How could I sum the fields automaticly (by each function) to sum some input fields like this:
<input name="price_1" id="price_1" type="text" value="50" />
<input name="price_2" id="price_2" type="text" value="40" />
<input name="price_3" id="price_3" type="text" value="20" />
<input name="price_4" id="price_4" type="text" value="10" />
<input name="price_5" id="price_5" type="text" value="80" />
Thank you very much if anyone has a suggestion?
Use jQuery;
<script src="{path to jquery}/resources/js/vendor/jquery-1.9.0.min.js"></script>
<script>
$(document).ready(function() {
var total = 0;
$.each($('input'), function(){
total += parseInt($(this).val(), 10); //use radix 10 to ensure correct parseInt val
});
console.log(total);
});
</script>
On jsfiddle
<input name="price_1" id="price_1" type="text" value="50" />
<input name="price_2" id="price_2" type="text" value="40" />
<input name="price_3" id="price_3" type="text" value="20" />
<input name="price_4" id="price_4" type="text" value="10" />
<input name="price_5" id="price_5" type="text" value="80" />
var inputs = document.getElementsByTagName("input");
function sumIt() {
var sum = Array.prototype.reduce.call(inputs, function (a, b) {
return a + parseFloat(b.value);
}, 0);
console.log(sum);
}
Array.prototype.forEach.call(inputs, function (input) {
input.addEventListener("keyup", sumIt, false);
});