Question

I’m using an input that takes a number that a user enters and converts it to a dollar amount when the blur event fires.

The issue I am having is that the browser seems to keep previously submitted values intact with their dollar signs. So if the user selects a previously entered value of ‘$25000’ from the drop down list, when the blur event fires again it adds in the ‘$’ so I get ‘$$25000’

In order to stop this, i’ve made an adjustment to the string value if it contains 2 ‘$’s on blur:

HTML:

<input type="text" value="$5,000" id="dollar-amount-goal" />

Javascript:

var valueOnBlur = $('#dollar-amount-goal').val();

if(valueOnBlur.charAt(1) === '$'){
    valueOnBlur = $('#dollar-amount-goal').val(valueOnBlur.substr(1));
}

console.log(typeof( valueOnBlur ));

The result of the typeof statement above when the string checking is run is ‘object’. any time after it comes out as ‘string’ (which is what I want).

My question: How do I make the "valueOnBlur = $('#dollar-amount-goal').val(valueOnBlur.substr(1));" statement return a string when it’s run?

Thanks

Answer 1

Try changing this:

valueOnBlur = $('#dollar-amount-goal').val(valueOnBlur.substr(1));

To this:

valueOnBlur = $('#dollar-amount-goal').val(valueOnBlur.substr(1)).val();

You want the value of the $('#dollar-amount-goal') and not the jQuery object that $('#dollar-amount-goal') will return