Question 14973 in Jquery Question posted in
The official Jquery Api Documentation can be found here.

Js Jquery td auto numbering with custom locale language

Is there any way to auto numbering table data with local or custom language. I’m a Bengali, I know how to auto numbering table each row 1st data using css and js. But I don’t know how to use custom number, e.g. Bangla or Arabic.

Look at my code:

<table border="1">
  <tr>
    <td>blue</td>
  </tr>
  <tr>
    <td>red</td>
  </tr>
  <tr>
    <td>black</td>
  </tr>
</table>

I want something like that;

১. Apple
২. Banana
৩. Orange
৪. Strawberry

How can I get that using Javascript / jquery.. Without adding any third party plugin.

Tags:

2

Answers


  1. 0

    You need to use toLocaleString() method or Intl.NumberFormat() constructor with the locale language as a parameter.

    For example.

    1. For Arabic numbers num.toLocaleString('ar-EG').
    2. For Bangla numbers num.toLocaleString('bn-BD')
    const table = document.querySelector('table');

[...table.rows].forEach((row, index) => {
  row.cells[0].textContent = (index + 1).toLocaleString('bn-BD')
})
    <table border="1">
  <tr>
    <td></td>
    <td>blue</td>
  </tr>
  <tr>
    <td></td>
    <td>red</td>
  </tr>
  <tr>
    <td></td>
    <td>black</td>
  </tr>
    Login or Signup to reply.
  2. 0

    A CSS only solution would be using the CSS counter(..) function and pass the counter-style parameter (list-style-type) for ‘bengali’.

    E.g. td::before { content: counter(some-counter, bengali) }

    Reference: MDN: counter() and MDN: list-style-type

    table {
    counter-reset: row 0;
}

tr {
    counter-increment: row;
}
td::before {
    content: counter(row, bengali) '. ';
}
    <table border="1">
  <tr>
    <td>blue</td>
  </tr>
  <tr>
    <td>red</td>
  </tr>
  <tr>
    <td>black</td>
  </tr>
</table>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search