글쓰기에서 옵션항목을 선택하게 한 후, 열거된 옵션에 없어서 "기타"로 처리해야 하는 경우는 "기타"의 상세내용을 적게 하려는데요.....
<tr>
<td>
<select name="wr_1" required size="1" value="<?=$write[wr_1]?>">
<option selected="selected" value="">사람이름을 선택하세요.</option>
<option value="기타" <?=($write[wr_1]=='기타')?"selected":""?>>기타 - 아래에서 찾을 수 없을 때는 아래 빈칸에 입력</option>
<option value="홍길동" <?=($write[wr_1]=='홍길동')?"selected":""?>>홍길동</option>
<option value="이수일" <?=($write[wr_1]=='이수일')?"selected":""?>>이수일</option>
<option value="심순애" <?=($write[wr_1]=='심순애')?"selected":""?>>심순애</option>
</select>
</td>
</tr>
예를 들어 위와 같이 있을 때 글쓰는 사람이 "기타"를 선택하는 경우에만 아래처럼 wr_2 필드 작성칸이 보이게 하고, wr_1 의 값이 "기타"인 경우에는 반드시 wr_2 항목을 작성하게 하려면 어떻게 코딩을 해야 하는지 실제 구현되도록 코딩 부탁 합니다. 감사합니다.
<tr>
<td><input style="width:100%;" name=wr_2 id="wr_2" itemname="기타이름입력" required value="<?=$wr_2?>" class=mw_basic_text></td>
</tr>
<tr>
<td>
<select name="wr_1" required size="1" value="<?=$write[wr_1]?>">
<option selected="selected" value="">사람이름을 선택하세요.</option>
<option value="기타" <?=($write[wr_1]=='기타')?"selected":""?>>기타 - 아래에서 찾을 수 없을 때는 아래 빈칸에 입력</option>
<option value="홍길동" <?=($write[wr_1]=='홍길동')?"selected":""?>>홍길동</option>
<option value="이수일" <?=($write[wr_1]=='이수일')?"selected":""?>>이수일</option>
<option value="심순애" <?=($write[wr_1]=='심순애')?"selected":""?>>심순애</option>
</select>
</td>
</tr>
예를 들어 위와 같이 있을 때 글쓰는 사람이 "기타"를 선택하는 경우에만 아래처럼 wr_2 필드 작성칸이 보이게 하고, wr_1 의 값이 "기타"인 경우에는 반드시 wr_2 항목을 작성하게 하려면 어떻게 코딩을 해야 하는지 실제 구현되도록 코딩 부탁 합니다. 감사합니다.
<tr>
<td><input style="width:100%;" name=wr_2 id="wr_2" itemname="기타이름입력" required value="<?=$wr_2?>" class=mw_basic_text></td>
</tr>
댓글 7개
스크립트로 처리할 수 있습니다.
1. 스크립트 소스
<script>
function selectPerson(selectValue) {
if (selectValue == "기타") {
document.getElementById("viewField").style.display = "block";
} else {
document.getElementById("viewField").style.display = "none";
}
}
</script>
2. 해당 select 박스에 onchange 추가
<select name="wr_1" required size="1" onchange="selectPerson(this.value);">
3. 숨기려하는 tr에 id 와 style 추가
<tr id="viewField" style="display:none;">
이거 적용하시면 되겠습니다.^^
1. 스크립트 소스
<script>
function selectPerson(selectValue) {
if (selectValue == "기타") {
document.getElementById("viewField").style.display = "block";
} else {
document.getElementById("viewField").style.display = "none";
}
}
</script>
2. 해당 select 박스에 onchange 추가
<select name="wr_1" required size="1" onchange="selectPerson(this.value);">
3. 숨기려하는 tr에 id 와 style 추가
<tr id="viewField" style="display:none;">
이거 적용하시면 되겠습니다.^^
위의 코드를 살짝 고쳐봤습니다. php 에서 selected 하는것보다 js 로 하는게 간단합니다.
<tr>
<td>
<select name="wr_1" required size="1">
<option selected="selected" value="">사람이름을 선택하세요.</option>
<option value="기타">기타 - 아래에서 찾을 수 없을 때는 아래 빈칸에 입력</option>
<option value="홍길동">홍길동</option>
<option value="이수일">이수일</option>
<option value="심순애">심순애</option>
</select>
</td>
</tr>
<tr id='etc_field' style='display:none;'>
<td><input style="width:100%;" name=wr_2 id="wr_2" itemname="기타이름입력" required value="<?=$wr_2?>" class=mw_basic_text></td>
</tr>
<script type="text/javascript">
$('select[name=wr_1]').val('<?=$write['wr_1']?>').change(function() {
if($(this).val() == '기타') {
$('#etc_field').show();
} else $('#etc_field').hide();
});
</script>
<tr>
<td>
<select name="wr_1" required size="1">
<option selected="selected" value="">사람이름을 선택하세요.</option>
<option value="기타">기타 - 아래에서 찾을 수 없을 때는 아래 빈칸에 입력</option>
<option value="홍길동">홍길동</option>
<option value="이수일">이수일</option>
<option value="심순애">심순애</option>
</select>
</td>
</tr>
<tr id='etc_field' style='display:none;'>
<td><input style="width:100%;" name=wr_2 id="wr_2" itemname="기타이름입력" required value="<?=$wr_2?>" class=mw_basic_text></td>
</tr>
<script type="text/javascript">
$('select[name=wr_1]').val('<?=$write['wr_1']?>').change(function() {
if($(this).val() == '기타') {
$('#etc_field').show();
} else $('#etc_field').hide();
});
</script>
else 로 빠질때요.. hide하거나 display:none 처리 하자나요.. 그럼 text 필드에 document.getElementById("wr_2").value="" 이렇게 되어야 할것 같아서요..^^;;
기타를 선택해도 그냥 넘어 가는 이유는..
submit() 하는곳에서 아래 처럼
if(document.getElementById("wr_1").value=="기타"){ // 셀렉트 값이 기타 일때 만 wr_2의 값을 아래 처럼 체크 해서
if(document.getElementById("wr_2").value==""){ //값이 없으면..
alert("값을 넣어 주세요");
document.getElementById("wr_2").focus();
return;
}
}
이정도가 될듯 하네요..
기타를 선택해도 그냥 넘어 가는 이유는..
submit() 하는곳에서 아래 처럼
if(document.getElementById("wr_1").value=="기타"){ // 셀렉트 값이 기타 일때 만 wr_2의 값을 아래 처럼 체크 해서
if(document.getElementById("wr_2").value==""){ //값이 없으면..
alert("값을 넣어 주세요");
document.getElementById("wr_2").focus();
return;
}
}
이정도가 될듯 하네요..
게시글 목록
| 번호 | 제목 |
|---|---|
| 284508 | |
| 284499 | |
| 284492 | |
| 284490 | |
| 284484 | |
| 284481 | |
| 284478 | |
| 284476 | |
| 284474 | |
| 284472 | |
| 284470 | |
| 284458 | |
| 284457 | |
| 284454 | |
| 284453 | |
| 284447 | |
| 284446 | |
| 284444 | |
| 284441 | |
| 284440 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기