CODEWITHSUNDEEP
javascriptjquerymoney-format
Damara Jati P
Damara Jati P

Reputation: 1807

JavaScript mask money doesn't work after adding another input in table

I am new in JavaScript and jQuery, and I have a problem when I use the mask money plugin. It worked well, but when I make some JavaScript to add another input in table, the new row doesn't work with the maskmoney even though it had the same class

Here's my table:

<thead>
    <tr>
        <td width="100"><center>Waqaf</center></td>
        <td width="100"><center>Operasional Sekolah</center></td>
        <td width="100"><center>Seragam</center></td>
    </tr>  
</thead>
<tbody>
    <tr>
        <td width="100"><input type="text" class="form-control price" name="waqaf" id=""></td>
        <td width="100"><input type="text" class="form-control price" name="operasional_sekolah" id=""></td>
        <td width="100"><input type="text" class="form-control price" name="seragam" id=""></td>
    </tr>
</tbody>

The JS for adding new field was running well, when I've checked the inspect element outputing input with same class. And the problem is in the plugin JS mask money

<script type="text/javascript">
    $('input.price').number( true, 2 );
</script>

(see picture below)

enter image description here

BUT when I manually make another text input it worked well

enter image description here

Why doesn't it work even though I make another field with js event with same input and class?

Upvotes: 0

Views: 1238

Answers (2)

Microfed
Microfed

Reputation: 2890

If you mean this plugin, then it's important to know it uses $.bind to handle events. It means that new inputs won't be handled in any way by this plugin. Today we should use $.on for this kind of bindings (and '$.live' in early versions of jQuery).

Upvotes: 1

jupadura
jupadura

Reputation: 71

You should do $('input.price').number( true, 2 ); each time a new row is created, the method currently only applies to the first row.

Upvotes: 1

Related Questions