체크박스 선택시 텍스트박스 활성화

체크박스 선택시 텍스트박스 활성화

QA

체크박스 선택시 텍스트박스 활성화

본문

체크박스 항목중에 마지막 기타가 있는데..

기타를 선택시 숨어있는 텍스트박스가 나오게 할수는 있나요?

라디오버튼이나 셀렉트방식은 많은 글들이 있는데..

아무리 찾아봐도 체크박스는 없네요..

초보입니다. 고수님들~! 도와주세요...ㅜ

이 질문에 댓글 쓰기 :

답변 2

구현 방법은 다양한데 어차피 기타 선택 시 활성화 여부니까 아래처럼 간단하게 하면 되겠네요.


<label><input type="checkbox" name="name[]" value="기타" onclick="document.getElementById('etc').style.display=this.checked?'inline-block':'none';">기타</label>
<input type="text" name="etc" id="etc" value="" style="display:none;">

* id는 유일해야 합니다.

저장된 값의 형태에 따라 기타체크여부 부분을 수정해주면 됩니다.


<?php
$display_check = '';
$display_style = 'none';
if ( 기타체크여부 ) {
    $display_check = ' checked';
    $display_style = 'inline-block';
}
?>
<label><input type="checkbox" name="name[]" value="기타" onclick="document.getElementById('etc').style.display=this.checked?'inline-block':'none';"<?=$display_check?>>기타</label>
<input type="text" name="etc" id="etc" value="" style="display:<?=$display_style?>;">


<?php
$display_check = '';
$display_style = 'none';
if ( 기타체크여부 ) {
    $display_check = ' checked';
    $display_style = 'inline-block';
}
?>
<label><input type="checkbox" name="name[]" value="기타" onclick="document.getElementById('etc').style.display=this.checked?'inline-block':'none';"<?=$display_check?>>기타</label>
<input type="text" name="etc" id="etc" value="<?=$저장된값?>" style="display:<?=$display_style?>;">

말씀하신대로 해도 안됩니다.
입력하고 노출은 잘되는데.. 수정으로 들어가면 기존 입력된 내용은 없어요..
보시고 어디가 잘못된건지.. 알려주시면 고맙겠습니다.


			<div class="form-group row mb-0">
             			<label class="col-md-2 col-form-label" for="wr_20">기타항목</label>
				<div class="col-md-10">
					<label><input type="checkbox" name="wr_3" value="기타" onclick="document.getElementById('etc').style.display=this.checked?'inline-block':'none';">&nbsp;기타항목입력</label>
					<input type="text" name="wr_3" id="etc" value="<?=$저장된값?>" style="display:none;">
				</div>
			</div>
<?php
$display_check = '';
$display_style = 'none';
if ( 기타체크여부 ) {
    $display_check = ' checked';
    $display_style = 'inline-block';
}
?>

그부분은 일단 div로 해서 묵어 두시고

 

<div class="etc_div" style="display:none">

<input type="radio">

</div>

 

 

제이쿼리로 열어주면되요

토글 아니면 show로 해주세요 

 

$(function() {

   $('.etc_div').click('click',function() {

    $(this).toggle();

   })

});

 

 

 

답변을 작성하시기 전에 로그인 해주세요.
전체 226
QA 내용 검색

회원로그인

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