I'm trying to add through a jquery event and I'm getting NaN. What am I missing?
<input type="hidden" id="skillcount" name="skillcount" value="3" onchange="valueadd(this)"/>
function valueadd(ok){
var value=parseFloat($(this).val())+1;
}
Add a comment
|
4 Answers
The code should be:
function valueadd(ok){
// "this" inside here refers to the window
var value=parseFloat(ok.value)+1;
}
The inline onchange is actually an anonymous function:
function() {
//"this" inside here refers to the element
valueadd(this);
}
So "this" is an argument that gets called "ok" in the valueadd scope. As the others have stated, though, you probably want to use jquery's bind so "this" inside of valueadd will point to the element.
1 Comment
JAAulde
+1 for explanation about the inline event handler (though I suspect it may not be grasped as I don't know many people who realize it)
this is a reserved word in JavaScript, so you can't use it in the function argument signature.
I'd probably change that code to...
$('#skillcount').change(function() {
var value = parseFloat($(this).val()) + 1;
});
...and drop the inline event handler.
To check if parseFloat() returns NaN, use isNaN().
1 Comment
Clay Smith
I don't have the this in it I wrote that for simplicity not knowing it was a reserved word. however the addition is comming up NaN still.It needs to be in a function since other things happen after this.
You should be able to do it simply like so:
<input type="hidden" id="skillcount" name="skillcount" value="3" onchange="valueadd()"/>
function valueadd()
{
var value=parseFloat(this.value)+1;
}
Comments
- Assign your behavior with jQuery since you have it available and are using it anyway. Don't use inline event handlers
- A function bound by jQuery is executed in scope of the element on which the event occurred. Which means
thisis the element. thiscannot be used as a param name or anything other than to access the object in scope.
Use:
<input type="hidden" id="skillcount" name="skillcount" value="3" />
<script type="text/javascript">
$( '#skillcount' ).bind( 'change', function()
{
var value = parseFloat( $( this ).val() ) + 1;
} );
</script>
1 Comment
JAAulde
FWIW, unless you manually trigger the change event for a hidden input, no such event ever occurs. Change requires
focus, change of value, and blur. Hidden inputs can never gain or lose focus, so they never "change"