Character Counter is showing a negative number, not initial value

[David Williams]

I'm unable to get the character counter to show an initial value.

When you type a something in, it says -1, -3, -4. It starts off at 0,
instead of the maximum amount allowed. I'd prefer it countdown from the
highest amount of characters allowed. 400, 399, 398, etc

$(document).ready(function() {
var counter, max_length, review_text;
review_text = $('#body');
counter = $('#counter');
max_length = counter.data('maximum-length');
review_text.keyup(function() {
counter.text(max_length - ($(this).val().length));
});
});

--
Posted via http://www.ruby-forum.com/.

[Tamara Temple]

This is a Javascript question, and has nothing to do with Rails.

Nevertheless, I think you need to convert max_length to an integer. If
it is comming off whatever tag has id="counter" and
data-maximum-lenght="400", that is being pulled in as a String. Perhaps
try:

max_length = parseInt(counter.data('maximum-lenght'));



--
Tamara Temple
tam...@gmail.com
http://www.tamouse.org

[David Williams]

tamouse m. wrote in post #1180583:

> David Williams <li...@ruby-forum.com> writes:
>
>> max_length = counter.data('maximum-length');
>> review_text.keyup(function() {
>> counter.text(max_length - ($(this).val().length));
>> });
>> });
>>
>

> This is a Javascript question, and has nothing to do with Rails.
>
> Nevertheless, I think you need to convert max_length to an integer. If
> it is comming off whatever tag has id="counter" and
> data-maximum-lenght="400", that is being pulled in as a String. Perhaps
> try:
>
> max_length = parseInt(counter.data('maximum-lenght'));
>

It's giving me Nan when I wrap the parseInt method around the counter.

[Walter Lee Davis]

> On Jan 13, 2016, at 12:44 AM, David Williams <li...@ruby-forum.com> wrote:
>
>>
>> max_length = parseInt(counter.data('maximum-lenght'));
>>
>
>
> It's giving me Nan when I wrap the parseInt method around the counter.

Check that your spelling of the attribute is correct, note the typo in the example. Also, if you want to be extra-careful (just had to deal with this yesterday) you can go all belt-and-suspenders on it:

parseInt( 0 + counter.data('maximum-length') )

The leading 0 + won't change the value, but it will force JavaScript to cast an empty string to zero, so you don't get NaN (not a number), which may actually be true, depending on how the parser does with the data-attribute.

Walter

[Walter Lee Davis]

> On Jan 13, 2016, at 7:48 AM, Walter Lee Davis <wa...@wdstudio.com> wrote:
>
>
>> On Jan 13, 2016, at 12:44 AM, David Williams <li...@ruby-forum.com> wrote:
>>
>>>
>>> max_length = parseInt(counter.data('maximum-lenght'));
>>>
>>
>>
>> It's giving me Nan when I wrap the parseInt method around the counter.
>
> Check that your spelling of the attribute is correct, note the typo in the example. Also, if you want to be extra-careful (just had to deal with this yesterday) you can go all belt-and-suspenders on it:
>
> parseInt( 0 + counter.data('maximum-length') )

Sorry, left out one more bit here:

parseInt( 0 + counter.data('maximum-length'), 10 )

The second argument to parseInt forces it to consider the input to be an n-base number, so it won't misinterpret a string 'number' as belonging to a different encoding scheme.

Walter

[David Williams]

Walter Davis wrote in post #1180603:

>>> It's giving me Nan when I wrap the parseInt method around the counter.
>>
>> Check that your spelling of the attribute is correct, note the typo in the
> example. Also, if you want to be extra-careful (just had to deal with
> this
> yesterday) you can go all belt-and-suspenders on it:
>>
>> parseInt( 0 + counter.data('maximum-length') )
>
> Sorry, left out one more bit here:
>
> parseInt( 0 + counter.data('maximum-length'), 10 )
>

> Walter

Is the last argument '10' the maximum amount allowed placeholder number?

[David Williams]

Walter Davis wrote in post #1180603:

>>> It's giving me Nan when I wrap the parseInt method around the counter.
>>
>> Check that your spelling of the attribute is correct, note the typo in the
> example. Also, if you want to be extra-careful (just had to deal with
> this
> yesterday) you can go all belt-and-suspenders on it:
>>
>> parseInt( 0 + counter.data('maximum-length') )
>
> Sorry, left out one more bit here:
>
> parseInt( 0 + counter.data('maximum-length'), 10 )

It's still giving me NaN, you can try the code if you want on a test
html form or text area.

[Colin Law]

Have you tried inserting
alert( counter.data('maximum-length') )
to see what the value is? then assuming it looks ok
alert (0 + counter.data('maximum-length'))
and
alert( parseInt( 0 + counter.data('maximum-length'), 10 ) )

Colin