숫자 입력에서 콤마(,) 제거하는 방법 - JavaScript와 PHP 코드 예제

웹사이트에서 숫자를 입력할 때 1,000처럼 천 단위 구분 기호(콤마)를 넣는 경우가 많다. 하지만 데이터 처리를 위해서는 이 콤마를 제거하고 순수한 숫자 값만 남겨야 한다. 특히 JavaScript와 PHP에서 콤마를 제거하는 방법은 초보 개발자들에게 꼭 필요한 기본적인 기능 중 하나다. 이번 글에서는 JavaScript와 PHP에서 입력된 숫자에서 콤마를 제거하는 방법을 살펴보자.

 

JavaScript에서 콤마 제거하기

JavaScript에서 사용자가 입력한 값에서 콤마를 제거하려면 replace() 메서드를 활용하면 된다. 특히 g 플래그를 사용하면 모든 콤마를 한 번에 제거할 수 있다.

var qty = row.find('input[name="col5[]"]').val().replace(/,/g, '');

코드 설명:

• row.find('input[name="col5[]"]').val() → 해당 입력 필드에서 값을 가져온다.
• .replace(/,/g, '') → ,를 빈 문자열로 변환하여 모든 콤마를 제거한다.
• 최종적으로 qty 변수에는 콤마가 제거된 숫자 값이 저장된다.

위 코드를 사용하면 1,000처럼 입력된 값이 1000으로 변환된다. 이렇게 하면 숫자 연산을 수행할 때 문제없이 사용할 수 있다.

PHP에서 콤마 제거하기

서버로 전송된 데이터에서도 콤마를 제거해야 한다. PHP에서는 str_replace() 함수를 이용하면 손쉽게 콤마를 제거할 수 있다.

$item_qty = isset($_POST['item_qty']) ? str_replace(',', '', $_POST['item_qty']) : 0;

코드 설명:

• isset($_POST['item_qty']) → 폼 데이터가 존재하는지 확인한다.
• str_replace(',', '', $_POST['item_qty']) → $_POST['item_qty']에서 모든 콤마를 제거한다.
• 값이 없는 경우 기본값 0을 할당한다.

이렇게 하면 사용자가 1,500을 입력해도 1500으로 변환되며, 숫자로 처리할 수 있다.

JavaScript + PHP 콤마 제거 조합하기

실제 웹 개발에서는 클라이언트(JavaScript)와 서버(PHP)에서 동시에 데이터를 처리해야 한다. 즉, 사용자가 입력한 값을 JavaScript에서 먼저 콤마를 제거한 후 서버에 전송하고, PHP에서도 한 번 더 체크하는 방식이 안전하다.

HTML 입력 필드 예제

<input type="text" id="item_qty" name="item_qty" value="1,000">
<button onclick="submitForm()">전송</button>

JavaScript에서 콤마 제거 후 전송하기

function submitForm() {
    var inputField = document.getElementById('item_qty');
    inputField.value = inputField.value.replace(/,/g, '');
    document.getElementById('myForm').submit();
}

위 방식으로 먼저 JavaScript에서 콤마를 제거하고, 이후 PHP에서 다시 한 번 데이터를 확인하면 더욱 안정적인 데이터 처리가 가능하다.

결론

웹사이트에서 숫자 데이터를 처리할 때, 천 단위 구분 기호(콤마)를 제거하는 것은 필수적인 작업이다. JavaScript에서는 replace(/,/g, '')을 활용하고, PHP에서는 str_replace(',', '', $_POST['item_qty'])을 사용하면 간단하게 해결할 수 있다. 이러한 작은 디테일이 사용자 경험을 향상시키고, 데이터 오류를 줄이는 데 큰 도움이 된다. 웹 개발을 하면서 이 방법을 적극 활용해 보자!