Character Counter is showing a negative number, not initial value

Rails
1

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

When you type 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));
});
});

2

David W. [email protected] writes:

  max_length = counter.data('maximum-length');
  review_text.keyup(function() {
    counter.text(max_length - ($(this).val().length));
  });
});

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

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 T.
[email protected]
http://www.tamouse.org

3

tamouse m. wrote in post #1180583:

David W. [email protected] 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.

4

On Jan 13, 2016, at 12:44 AM, David W. [email protected] 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

5

Walter D. 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?

6

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

7

On 13 January 2016 at 20:13, David W. [email protected]
wrote:

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.

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

8

Walter D. 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.