Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Materialize (Framework) Character Count

I can't figure out why the character count is displaying as "1/101/10".

enter image description here

Codepen: http://codepen.io/anon/pen/avdbLG

It appears the "/101/" is a combination of the max-limit (10) and current count (1). As you type in the field, the "/101/" is incremented with the amount of characters typed.

HTML:

<div class="row">
  <form class="col s12">
    <div class="row">
      <div class="input-field col s6">
        <input id="input_text" type="text" length="10">
        <label for="input_text">Input text</label>
      </div>
    </div>
    <div class="row">
      <div class="input-field col s12">
        <textarea id="textarea1" class="materialize-textarea" length="120"></textarea>
        <label for="textarea1">Textarea</label>
      </div>
    </div>
  </form>
</div>

JS:

$(document).ready(function() {
  $('input#input_text, textarea#textarea1').characterCounter();
});
like image 457
Nic Stelter Avatar asked Sep 13 '15 17:09

Nic Stelter


2 Answers

Nothing answered here worked for me.

This is how i got it working:

document.addEventListener('DOMContentLoaded', function () {
            var textNeedCount = document.querySelectorAll('#input_text, #textarea1');
            M.CharacterCounter.init(textNeedCount);
});
like image 134
L.Nightman Avatar answered Nov 14 '22 06:11

L.Nightman


Please remove the initialization code.

$('input#input_text, textarea#textarea1').characterCounter();

It works fine.

like image 2
Bala K Avatar answered Nov 14 '22 08:11

Bala K