view.skin에서 선택에 따라 각기 다른 묶음의 폼 필드들 나타나게... 정보
view.skin에서 선택에 따라 각기 다른 묶음의 폼 필드들 나타나게...본문
'wr_9'을 셀렉트 메뉴로 구현해 놓았고,
그 셀렉트 메뉴(wr_9)의 4개 메뉴 리스트의 선택에 따라서
각기 다른 묶음의 폼 필드를 보여지게 해봤습니다.
아래와 같이 write.skin.php 에서는 셀렉트 메뉴 리스트 선택에 따라서
Field_1, Field_2, Field_3로 각각 묶어놓은 폼 필드들이 잘 나누어져 나타나는데요...
view.skin.php 에서는 어떻게 구현해 주어야 하는지...
초보의 내공으로는 몇일째 구현하려다가 혼수상태가 되어...
고수님들께서 잠시 시간내셔서 도움 주셨으면 합니다.
감사합니다. ( 꾸우~벅 )
[ write.skin.php ]
<script>
$(document).ready(Function(){
$("#Field_1").hide();
$("#Field_2").hide();
$("#Field_3").hide();
$("#wr_9").change(Function(){
if (this.value == 'SelectLine_1'){
$("#Field_1").show();
$("#Field_2").hide();
$("#Field_3").hide();
}
else if (this.value == 'SelectLine_2'){
$("#Field_1").hide();
$("#Field_2").show();
$("#Field_3").hide();
}
else if (this.value == 'SelectLine_3'){
$("#Field_1").hide();
$("#Field_2").hide();
$("#Field_3").show();
}
else if (this.value == 'SelectLine_4'){
$("#Field_1").hide();
$("#Field_2").hide();
$("#Field_3").show();
}
}).change();
$("#wr_9").change(Function(){
}).change();
});
</script>
그 셀렉트 메뉴(wr_9)의 4개 메뉴 리스트의 선택에 따라서
각기 다른 묶음의 폼 필드를 보여지게 해봤습니다.
아래와 같이 write.skin.php 에서는 셀렉트 메뉴 리스트 선택에 따라서
Field_1, Field_2, Field_3로 각각 묶어놓은 폼 필드들이 잘 나누어져 나타나는데요...
view.skin.php 에서는 어떻게 구현해 주어야 하는지...
초보의 내공으로는 몇일째 구현하려다가 혼수상태가 되어...
고수님들께서 잠시 시간내셔서 도움 주셨으면 합니다.
감사합니다. ( 꾸우~벅 )
[ write.skin.php ]
<script>
$(document).ready(Function(){
$("#Field_1").hide();
$("#Field_2").hide();
$("#Field_3").hide();
$("#wr_9").change(Function(){
if (this.value == 'SelectLine_1'){
$("#Field_1").show();
$("#Field_2").hide();
$("#Field_3").hide();
}
else if (this.value == 'SelectLine_2'){
$("#Field_1").hide();
$("#Field_2").show();
$("#Field_3").hide();
}
else if (this.value == 'SelectLine_3'){
$("#Field_1").hide();
$("#Field_2").hide();
$("#Field_3").show();
}
else if (this.value == 'SelectLine_4'){
$("#Field_1").hide();
$("#Field_2").hide();
$("#Field_3").show();
}
}).change();
$("#wr_9").change(Function(){
}).change();
});
</script>
댓글 전체
여러 방법이 있겠지만, 기존에 짜신 소스를 토대로 가장 심플하게 짜보자면,
이렇게 짜시면 될 듯 합니다.
$(document).ready(Function(){
$("#Field_1").hide();
$("#Field_2").hide();
$("#Field_3").hide();
<? if($wr_9 == 'SelectLine_1') { ?>
$("#Field_1").show();
$("#Field_2").hide();
$("#Field_3").hide();
<? } else if($wr_9 == 'SelectLine_2'){ ?>
$("#Field_1").hide();
$("#Field_2").show();
$("#Field_3").hide();
.
.
(중략)
.
.
.
});
이렇게 짜시면 될 듯 합니다.
물론, 기존의 write.skin.php 폼과 동일한 구성으로 view.skin.php 에 구현해 주셔야 하구요.
솔직히 좋은 방법은 저렇게 스크립트를 쓰는게 아닌 view.skin.php 소스 상에서
이렇게 뿌려 주는거겠죠.
솔직히 좋은 방법은 저렇게 스크립트를 쓰는게 아닌 view.skin.php 소스 상에서
<? if($wr_9 == 'SelectLine_1') { ?>
<div id= "Field_1" ></div>
<? } else if ($wr_9 == 'SelectLine_2') { ?>
<div id= "Field_2" ></div>
<? } else if ($wr_9 == 'SelectLine_3' || $wr_9 == 'SelectLine_4') { ?>
<div id= "Field_3" ></div>
<? } ?>
이렇게 뿌려 주는거겠죠.
소중한 시간 내셔서
view.skin의 올바른 구현방법과
자세한 설명까지 적어주셨군요..!
성의있는 답변주셔서 진심으로 감사드립니다.
위와 같이 적용해 보았는데...
제가 부족하여 Field_1, Field_2, Field_3이 모두 순서대로 나타나네요...
혹...
<? if($wr_9 == 'SelectLine_1') { ?>
<div id= "Field_1" ></div>
이곳에 Field_2 와 Field_3 이(가) 나타나지 않게 구현하고,
<? } else if ($wr_9 == 'SelectLine_2') { ?>
<div id= "Field_2" ></div>
위와 같이 Field_1 과 Field_3 이(가) 나타나지 않게 구현한 후,
<? } else if ($wr_9 == 'SelectLine_3' || $wr_9 == 'SelectLine_4') { ?>
<div id= "Field_3" ></div>
마지막으로 Field_1 과 Field_2 가 보여지지 않게 구현하는 방법은 없는지요?
<? } ?>
view.skin의 올바른 구현방법과
자세한 설명까지 적어주셨군요..!
성의있는 답변주셔서 진심으로 감사드립니다.
위와 같이 적용해 보았는데...
제가 부족하여 Field_1, Field_2, Field_3이 모두 순서대로 나타나네요...
혹...
<? if($wr_9 == 'SelectLine_1') { ?>
<div id= "Field_1" ></div>
이곳에 Field_2 와 Field_3 이(가) 나타나지 않게 구현하고,
<? } else if ($wr_9 == 'SelectLine_2') { ?>
<div id= "Field_2" ></div>
위와 같이 Field_1 과 Field_3 이(가) 나타나지 않게 구현한 후,
<? } else if ($wr_9 == 'SelectLine_3' || $wr_9 == 'SelectLine_4') { ?>
<div id= "Field_3" ></div>
마지막으로 Field_1 과 Field_2 가 보여지지 않게 구현하는 방법은 없는지요?
<? } ?>
(아래) 이런식으로 해보았는데...
역시, 순서대로 배열되어 나타나네여...
다른 방법으로 구현할 수 있는 방법은 없나요?
<style type="text/css">
.HiddenDiv { display:none; }
.VisibleDiv { display:block; }
</style>
<script type="text/javascript">
<? if($wr_9 == 'SelectLine_1') { ?>
<div id="Field_1" class="VisibleDiv"></div>
<div id="Field_2" class="HiddenDiv"></div>
<div id="Field_3" class="HiddenDiv"></div>
<? } else if ($wr_9 == 'SelectLine_2') { ?>
<div id="Field_1" class="HiddenDiv"></div>
<div id="Field_2" class="VisibleDiv"></div>
<div id="Field_3" class="HiddenDiv"></div>
<? } else if ($wr_9 == 'SelectLine_3' || $wr_9 == 'SelectLine_4') { ?>
<div id="Field_1" class="HiddenDiv"></div>
<div id="Field_2" class="HiddenDiv"></div>
<div id="Field_3" class="VisibleDiv"></div>
<? } ?>
</script>
역시, 순서대로 배열되어 나타나네여...
다른 방법으로 구현할 수 있는 방법은 없나요?
<style type="text/css">
.HiddenDiv { display:none; }
.VisibleDiv { display:block; }
</style>
<script type="text/javascript">
<? if($wr_9 == 'SelectLine_1') { ?>
<div id="Field_1" class="VisibleDiv"></div>
<div id="Field_2" class="HiddenDiv"></div>
<div id="Field_3" class="HiddenDiv"></div>
<? } else if ($wr_9 == 'SelectLine_2') { ?>
<div id="Field_1" class="HiddenDiv"></div>
<div id="Field_2" class="VisibleDiv"></div>
<div id="Field_3" class="HiddenDiv"></div>
<? } else if ($wr_9 == 'SelectLine_3' || $wr_9 == 'SelectLine_4') { ?>
<div id="Field_1" class="HiddenDiv"></div>
<div id="Field_2" class="HiddenDiv"></div>
<div id="Field_3" class="VisibleDiv"></div>
<? } ?>
</script>