Add Comma automatically while entering amounts in textbox using Javascript

-
Use following JavaScript function to add comma in numeric input in textbox


function Comma(Num)
 {
       Num += '';
       Num = Num.replace(/,/g, '');

       x = Num.split('.');
       x1 = x[0];

       x2 = x.length > 1 ? '.' + x[1] : '';

       
         var rgx = /(\d)((\d)(\d{2}?)+)$/;

       while (rgx.test(x1))

       x1 = x1.replace(rgx, '$1' + ',' + '$2');
     
       return x1 + x2;       
        
 }

Use following event of input textbox to call above function 

onkeyup = "javascript:this.value=Comma(this.value);"

Comments

  1. AnonymousJune 12, 2013 at 9:36 PM

    This doesn't work as it should.
    It works ok for the first thousand - a comma is inserted after entering 1000 - but when you continue entering numbers after that, it inserts consecutive commas after 2 digits, not 3, so you get something like this: 10,00,000 - where it should be: 1,000,000

    Did you test this with more than 4 digits?

    ReplyDelete
    Replies
    1. vikas sonichyaJuly 7, 2013 at 12:19 AM

      Thank you for your valuable comment

      i will look into the issue and update this post soon

      Delete
    2. MunazzahNovember 18, 2013 at 11:28 PM

      just replace the regular expression with this:

      var rgx = /(\d)((\d{3}?)+)$/;

      Delete
  2. AnonymousJuly 4, 2018 at 4:05 AM

    in c#

    ReplyDelete
  3. AnonymousJuly 4, 2018 at 4:06 AM

    i need in asp.net textbox when type amount 12000 out should come in 12,000 likes this

    ReplyDelete
  4. Odessa MistressNovember 17, 2024 at 7:31 AM

    Hi nice reading your bloog

    ReplyDelete

Post a Comment

Popular posts from this blog

I have created an application to extract text from image using AI

-
Image
 In this article, I am going to demonstrate how text is getting extracted from image file using Gemini AI model. Also, will explain how the application is developed with the help of chat GPT and some custom code.     Very first i gone to chatGPT application and added below prompts so that my application structure i can get the application code to start with. Following is the screenshot of the prompt i have written and answer given by chatGPT.    I have copied the code given by chat gpt and modified as per my requirement that means i got 70 to 80 percentage code to develop the application. Following are the Prerequisites required for development of this application : Visual studio code Python Api Key of Gemini can be obtain from https://aistudio.google.com    Open visual studio code and create the file with name " imagetextextractapp .py". Now in visual studio code and go to terminal menu and click on New terminal link it will open new terminal. In t...
Read more

Angular User Session Timeout example step by step

-
Image
This functionality let the user know that their session is about to expire and that they would be logged out if they didn’t take action. I have written this functionality in Angular for my latest application.  If you are new to Angular 6 then read my article about Setting up Angular 6 step by step before jump to this article to get handy in Angular 6. Dealing with timers in Angular can be significantly different when using React components and subscriptions. The basic premises remains the same, though. We’ll have a service with a timer that will provide a Subject to which consumers of the service can subscribe. A React Subject provides an easy mechanism to trigger a “next” subscription to alert consumers that the timer has expired.   import { Injectable } from '@angular/core'; import { Observable, Subject, Subscription, BehaviorSubject} from 'rxjs/Rx'; @Injectable() export class IdleTimeoutService { private _count: number = 0; ...
Read more

Create Chat bot application using Python, Streamlit and Gemini AI

-
Image
In this article I am going to explain creating chat bot application using Python, Streamlit library and Gemini AI. In this chat bot application application will be self host with specific port on computer ad can be accessible from browser.     following Prerequisites required for development of this application : Visual studio code Python Api Key of Gemini can be obtain from https://aistudio.google.com    Open visual studio code and create the file with name "chatbot.py". Now in visual studio code and go to terminal menu and click on New terminal link it will open new terminal. In terminal enter below command to install the Google generative AI library and steamlit library in your machine.   pip install google-generativeai langchain-google-genai streamlit   Now copy below code and paste in the " chatbot .py" file. import streamlit as st import google.generativeai as genai genai.configure(api_key="enter your key obtain from aistudio.google.com...
Read more

Understanding the Singleton Design Pattern in C#

-
Image
The Singleton design pattern is one of the most widely used creational design patterns. It ensures that a class has only one instance while providing a global point of access to it. This is particularly useful when exactly one object is needed to coordinate actions across the system. In this blog post, we will explore the Singleton pattern in C#, understand why it’s useful, and review various implementations including thread safety and the usage of the Lazy<T> class. We will also look at how each of these approaches works with example code. Why Use the Singleton Pattern?   The primary purpose of the Singleton pattern is to control object creation by limiting the number of instances to just one. Some of the common use cases include: Configuration management: A centralized configuration object that needs to be accessed across different parts of the application. Logging: Logging systems should have a single instance for maintaining a consistent log throughout the application. C...
Read more

Implement Logging in CSV file using Nlog in .net core MVC application- part 2

-
Image
In previous article " Implement Nlog in .Net core MVC application part 1 "  I have demonstrated how we can implement basic setup of NLog in .core mvc application. In previous article we have logged the exceptions in flat file system. In this article I will show you how you can write the exception and custom logs in csv file. Writing logs in csv file can enable us better readability of logs in tabular form.       Lets start the implementation of it, I going to use the same example project used in previous demonstration. Modify the Nlog.config file as follows, added new target and rule for logging logs in csv file. <?xml version="1.0" encoding="utf-8" ?> <nlog xmlns="http://www.nlog-project.org/schemas/NLog.xsd" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.nlog-project.org/schemas/NLog.xsd NLog.xsd" autoReload="true" throwExceptions="fal...
Read more