I have an input field where I can take input of amount in xxx,xx or x,xx or x or xxxxx,xx etc i.e 2 digit after one comma (as comma is getting used as decimal point seperator).

Here is my attempt:

<div class="input-group mb-3">
                        <input type="text" class="form-control num-only-with-comma rounded-0" id="belob"
                            placeholder="Valgfrit beløb" aria-label="Recipient's username"
                            aria-describedby="basic-addon2">
                        <span class="input-group-text" id="basic-addon2">DKK</span>
                        <div id="belob-feedback" class="invalid-feedback">
                            Incorrect Amount
                        </div>
                    </div>

$(".num-only-with-comma").keypress(function (e) {
        if (
            e.key != "," &&
            e.which != 8 &&
            e.which != 0 &&
            (e.which < 48 || e.which > 57)
        ) {
            return false;
        }
    });

However, I can give multiple commas like 15,23,,555,5 which should not be like that.

In parallel, I need to do validation of the amount for which I need to convert an amount string like 149,89 or 1200,70 etc back to float i.e. 149.89 or 1200.70 respectively.

Here is the validation code I currently have:

$("#belob").keyup(
        _.debounce(function () {
            const elem = $(this);
            if (parseFloat(elem.val().replace(',','.').replace(' ','')) <= 0.0) {
                $("#belob-feedback").text(
                    "Indtast venligst et beløb, der er større end nul"
                );
                elem.toggleInvalid();
                $("#submit_btn").prop("disabled", true);
            } else {
                elem.toggleValid();
                $("#submit_btn").prop("disabled", false);
            }
        }, 250)
    );

How can I achieve the desire output?