(자바스크립트)기타를 선택했을때 빈칸을 채우고 싶습니다.

매출이 오르면 내리는 수수료! 지금 수수료센터에서 전자결제(PG)수수료 비교견적 신청해 보세요!
(자바스크립트)기타를 선택했을때 빈칸을 채우고 싶습니다.

QA

(자바스크립트)기타를 선택했을때 빈칸을 채우고 싶습니다.

본문

아래와 같은 소스가 있습니다.

(중요하지 않은 일부는 제외하였습니다.)

 


    <input type="radio" name="choice" value="선택1">선택1
        <input type="radio" name="choice" value="선택2">선택2
        <input type="radio" name="choice" value="기타">기타
        <input type="text" name="choice_etc" id="choice_etc" >
        
        
<script>            
        if (!$("input[name='choice']").is(':checked')) {
            alert("종류를 선택하세요.");
            $("choice").focus();
            return false;
        }
</script>

 

선택을 하지 않으면 아래쪽 스크립트에서 "종류를 선택하세요"라는

메세지를 띄우는것입니다.

 

하고 싶은것은

기타를 선택했을때 텍스트박스를 꼭 채우게 하고 싶습니다.

 

기타를 선택한 후에 choice_etc 텍스트박스가 비어있으면

"기타 내용을 적어주세요"라는 메세지를 띄우려면 

스크립트에 어떤것을 추가해야 할까요?

 

도움을 기다립니다.

감사합니다.

이 질문에 댓글 쓰기 :

답변 2


<script>
    // 폼 제출 시 유효성 검사
    $('form').on('submit', function(e) {
        // 라디오 버튼 선택 여부 확인
        if (!$("input[name='choice']").is(':checked')) {
            alert("종류를 선택하세요.");
            return false;
        }
        
        // '기타' 선택 시 텍스트박스 필수 입력 확인
        if ($("input[name='choice']:checked").val() === '기타') {
            if ($("#choice_etc").val().trim() === '') {
                alert("기타 내용을 적어주세요.");
                $("#choice_etc").focus();
                return false;
            }
        }
    });
</script>

답변감사드립니다. 작동 잘 합니다.
하나만 더 여쭤보겠습니다.
라디오버튼일때에는 주신 소스가 작동을 잘 하네요
근데 폼중에 체크박스도 있어서 여기에도 똑같이 적용했더니
체크박스에서는 작동을 안하네요 (중복선택이 되었을때 작동을 안합니다.)

체크박스는 아래와 같습니다.
<input type="checkbox" name="choice2[]" id="choice2" value="선택1">
        <input type="checkbox" name="choice2[]" id="choice2" value="기타">
        <input type="text" name="choice2_etc" id="choice2_etc">


<script>
    $('form').on('submit', function(e) {
        // 체크박스 최소 선택 개수 확인
        var checkedBoxes = $("input[name='choice']:checked");
        
        // 최소 1개 선택 강제
        if (checkedBoxes.length === 0) {
            alert("최소 한 개 이상의 항목을 선택해주세요.");
            return false;
        }
        
        // 최대 선택 개수 제한 (예: 최대 3개)
        if (checkedBoxes.length > 3) {
            alert("최대 3개까지만 선택 가능합니다.");
            return false;
        }
        
        // '기타' 체크박스 선택 시 텍스트박스 필수 입력 확인
        if ($("#choice_etc_checkbox").is(':checked')) {
            if ($("#choice_etc").val().trim() === '') {
                alert("기타 내용을 적어주세요.");
                $("#choice_etc").focus();
                return false;
            }
        }
    });
</script>


<script>
if (!$("input[name='choice']").is(':checked')) {
    alert("종류를 선택하세요.");
    $("choice").focus();
    return false;
}
 
if ($("input[name='choice']:checked").val() == "기타" && $("#choice_etc").val() == "") {
    alert("기타 내용을 적어주세요.");
    $("#choice_etc").focus();
    return false;
}
</script>
답변을 작성하시기 전에 로그인 해주세요.
전체 7
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT