Question 178953 in Javascript Question posted in
A very good W3school tutorial can be found here.

Why does JS add extra space when taking input as a comma-separated string?

Why this function takes extra space in front while taking an input?

My html.erb file is:

<%= form.text_field :monthly_income, class: 'form-control', required: true, onkeyup: "formatLoanAmount(this)" %>

And my script file is:

function formatLoanAmount(element) {
        const formatter = new Intl.NumberFormat('en-US', {
            style: 'currency',
            currency: 'bdt',
            minimumFractionDigits: 0,
            maximumFractionDigits: 0,
        });
        input_value = element.value.toString().replace(/BDT/g, '').replace(/,/g, '');
        formatted_number = formatter.format(input_value);
        formatted_number = formatted_number.toString().replace(/BDT/g, '');
        element.value = formatted_number;
    }

I’m tryig to take input as a comma sepetated string and expection an integer as output.

Tags:

2

Answers


  1. 0

    However, you can use trim() function to remove whitespaces if exits. Here is the updated version of your code.

    function formatLoanAmount(element) {
    const formatter = new Intl.NumberFormat('en-US', {
        style: 'currency',
        currency: 'bdt',
        minimumFractionDigits: 0,
        maximumFractionDigits: 0,
    });
    input_value = element.value.toString().replace(/BDT/g, '');
    input_value = input_value.replace(/,/g, '').trim(); // Replace commas and trim whitespace if any
    formatted_number = formatter.format(input_value);
    formatted_number = formatted_number.replace(/BDT/g, '').trim();
    element.value = formatted_number;
}
    Login or Signup to reply.
  2. 0

    The extra space in front of the input value might be caused by the replace method in your formatLoanAmount function. Specifically, the replace(/BDT/g, '') part of the code is removing all occurrences of the string "BDT" from the input value. If the input value starts with "BDT", then this will leave an extra space at the beginning of the formatted number.

    To fix this issue, you can modify the replace method to remove all occurrences of "BDT " (with a space after "BDT") instead of just "BDT". Here’s the updated code:

    function formatLoanAmount(element) {
  const formatter = new Intl.NumberFormat('en-US', {
    style: 'currency',
    currency: 'bdt',
    minimumFractionDigits: 0,
    maximumFractionDigits: 0,
  });
  input_value = element.value.toString().replace(/BDT /g, '').replace(/,/g, '');
  formatted_number = formatter.format(input_value);
  formatted_number = formatted_number.toString().replace(/BDT/g, '');
  element.value = formatted_number;
}

    This should remove any extra spaces at the beginning of the formatted number.

    Additionally, if you want to convert the formatted number back to an integer without commas, you can modify the formatted_number variable to remove all commas before assigning it to element.value. Here’s the updated code:

    function formatLoanAmount(element) {
  const formatter = new Intl.NumberFormat('en-US', {
    style: 'currency',
    currency: 'bdt',
    minimumFractionDigits: 0,
    maximumFractionDigits: 0,
  });
  input_value = element.value.toString().replace(/BDT /g, '').replace(/,/g, '');
  formatted_number = formatter.format(input_value);
  formatted_number = formatted_number.toString().replace(/BDT/g, '').replace(/,/g, '');
  element.value = formatted_number;
}

    This should ensure that the input value is converted to an integer without commas after formatting.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search