Given a number input:
<input type="number" id="create-y-small" name="create-y-small" value="0">
How do I get the value of the input as a number? The following returns a string:
$("#create-y-small").val()
Why is this the default behavior? Surely one should expect a number type input to give a number?
I've looked for answers elsewhere but no luck:
Input value is a string instead of a number - Answers use parsing to parse to a number. I don't want to parse to a number I just want to get the number as a number.
Get variable value from input number - OP seemed happy to get the value as a string
Get the value of a input number in jQuery - Same story
https://www.codegrepper.com/code-examples/javascript/how+to+get+the+value+of+input+number+using+jquery - Same story
You can use jQuery's valHooks to change how jQuery returns values.
$.valHooks.number = {
get: function( elem ) {
return elem.value * 1;
}
};
You only need to do this once in your code and then all type=number inputs will instead return a number.
console.log(
"num is a string",
$("#num").val() === "1",
$("#num").val() === 1,
$("#txt").val() === "1",
$("#txt").val() === 1)
$.valHooks.number = {
get: function( elem ) {
return elem.value * 1;
}
};
// confirm no neffect on type='text'
console.log(
"num is a number",
$("#num").val() === "1",
$("#num").val() === 1,
$("#txt").val() === "1",
$("#txt").val() === 1)
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type='number' id='num' value="1">
<input type='text' id='txt' value="1">All input elements in HTML return a string as their value. If you want the result as an int, you have to convert it.
parseInt($("#create-y-small").val())