0

I've been trying all day long and nothing seemed to work.

What I'd like my website to do, is that I enter a value in a table cell in my code, and the displayed result would be the same value, but thousand separated. These values are strictly numbers, though on the page not every content is numbers exclusively.

I've tried dozens of different javascript codes to no avail and I'm starting to give up hope. I looked through my code and nothing seems to contradict each other, so what could be the problem? Is this really such a hard task to pull out?

Thank you very much for any input from you and the time to take to work on this problem with me! I'm eager to provide any info you'd possibly need to understand the situation better!

  • 2
    Possible duplicate of [How to print a number with commas as thousands separators in JavaScript](http://stackoverflow.com/questions/2901102/how-to-print-a-number-with-commas-as-thousands-separators-in-javascript) – James Paterson Jul 21 '16 at 21:36

3 Answers3

0

use toLocaleString

let numb=5934859384;
numb.toLocaleString('pl-PL')

or toFixed

let numb=82384.23456;
console.log(numb.toFixed(2));

or create function like:

function addDots(numb,position){
  let str=numb.toString().trim();
  let arr=str.split('');
  let result='';
  let index=0;
  for(let i=arr.length-1;i>=0;i--){
    index++;
    let nr=arr[i];
    result=nr+result;
    if(index == position){
        result='.'+result;
      index=0;
    }
  }
  let firstIsDot=result.substr(0,1);
  if(firstIsDot=='.'){
    result=result.substr(1);
  }
  return result;
}

let numb=3484762347;
console.log(addDots(numb,4)); // 34.8476.2347

if you want to replace numbers in table:

function replaceTableNumbers(){
    let tds=$('td');
  for(let i=0;i<tds.length;i++){
    let td=tds[i];
    let txt=$(td).text().trim();
    if(txt.match(/^[0-9]+$/)!=null){
        let parsed=addDots(txt,3);
        $(td).text(parsed);
    }
  }
}

$(document).ready(function(){
  replaceTableNumbers();
})
neuronet
  • 1,139
  • 8
  • 19
  • I just added this to my javascript and it didn't do anything. What exactly does the " // 34.8476.2347" part means at the end? Is that just an example of how it should work? Do I need to add specific numbers that I have in the code and I want displayed on the page with the specific thousand separators? – Richárd Nagy Jul 21 '16 at 21:55
  • Ah, I see now... You see, what I need is not an input box. I don't plan to put one on my site. I want the web page to display the code that I write in the table cell itself, as thousand separated. So there won't be a box where users can write, I just want my own content displayed that way. No input box. Just the table with the numbers, thousand separated. – Richárd Nagy Jul 21 '16 at 22:21
  • OOoooh! Now that looks reaaally nice!! I want it! – Richárd Nagy Jul 21 '16 at 22:39
  • [your site](https://jsfiddle.net/zhxe0x34/3/) with ``replaceTableNumbers`` – neuronet Jul 21 '16 at 22:50
  • if this is what you looking for just accept answer above this comments, thx – neuronet Jul 21 '16 at 23:00
  • It's exactly what I'm looking for but the weirdest thing is when I create a blank site containing ONLY the code displayed in the fiddle, I can't reproduce the dotted effect! It's incredibly weird... Do I need any external document other from the code in the fiddle? – Richárd Nagy Jul 21 '16 at 23:28
  • Oh my god, I've just noticed that you actually implemented the code into the site and it works!! Okay, I'll find how you did it and I'll just copy it shamelessly but damn I'm exteremly glad that you took the time to do this!! You have my endless gratitude and I'm accepting the answer right away! – Richárd Nagy Jul 21 '16 at 23:29
0

Does this solution work?

function numberWithCommas(x) {
    return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}

Taken from: How to print a number with commas as thousands separators in JavaScript

Community
  • 1
  • 1
Timothy Chen
  • 374
  • 1
  • 15
  • I've checked this topic before and it had many solutions that seemed to be good but none worked for me. Tried again now, and still nothing, I have no idea what could be the problem, honestly. Added this to the end of my javascript, saved, opened the page and nothing. it's beyond me at this point and I just don't understand why doesn't it work! – Richárd Nagy Jul 21 '16 at 21:57
  • I think you have to call the above function in something, such as when the document detects that the textbox changed. – Timothy Chen Jul 21 '16 at 23:58
0

You mean like this answer?

$('input.number').keyup(function(event) {

  // skip for arrow keys
  if(event.which >= 37 && event.which <= 40) return;

  // format number
  $(this).val(function(index, value) {
    return value
    .replace(/\D/g, "")
    .replace(/\B(?=(\d{3})+(?!\d))/g, ",");
  });
});
Community
  • 1
  • 1
BarthesSimpson
  • 926
  • 8
  • 21
  • As I have checked, this answer was provided for an input box, but I'm going to try it. Do I need to add a container, like, a division for example with "number" class for this to work? Because I've tested it just now and it doesn't seem to do anything at all for me. – Richárd Nagy Jul 21 '16 at 21:51
  • Naturally! https://jsfiddle.net/zhxe0x34/1/ Basically, this is it. If it's a bit too much I can understand that. Also sorry about the language, please disregard that if you can! The problematic area in question would be the elements listed under the "Ár" category. I would like those to be displayed with thousand separation. – Richárd Nagy Jul 21 '16 at 22:14
  • How is the coin data populating? All I see is a lot of bootstrap plugins. – BarthesSimpson Jul 21 '16 at 22:35
  • The coin in the navigation showing up next to the text is partially coded in css at the hover image span part and partially in html, the coins in the table are html-only, if that's what you mean. – Richárd Nagy Jul 21 '16 at 23:12