체크박스 선택시 텍스트박스 활성화
본문
체크박스 항목중에 마지막 기타가 있는데..
기타를 선택시 숨어있는 텍스트박스가 나오게 할수는 있나요?
라디오버튼이나 셀렉트방식은 많은 글들이 있는데..
아무리 찾아봐도 체크박스는 없네요..
초보입니다. 고수님들~! 도와주세요...ㅜ
답변 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';"> 기타항목입력</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();
})
});
죄송합니다.
초보자라보니 무슨 말씀이신지 정확하게 모르겠네요..
좀 더 자세한 설명을...ㅜ
체크 박스 중에서 마지막 항목에 기타가 있다고 했잖아요?
그부분을 코드를 보여주세요 길게는 못해도 잠깐은 봐드릴게요
답변을 작성하시기 전에 로그인 해주세요.