selectBOX기능적 질문입니다.
본문
select box에서 선택시 기간이 자동으로 선택되는 기능을 구현중에 있습니다.
예를 들면
1 선택시 기간에는 2022-07-01~2022-08-30
2선택시 기간에는 2022-09-01~2022-10-30
으로 입니다.
그런데 선택시에는 기능이 정상적으로 이루어지는데 초기 선택을 2번으로 할 경우 1번의 기간이 출력이 됩니다.
해결 방법이 있나요?
해당 부분 코드입니다.
<select name="ac_code_sel" id="ac_code_sel" style="height:20px;">
<option value="n">-선택-</option>
<?
$now_year=date("Y");
$query = "select * from academin_calender where semester_year = '{$now_year}' ORDER BY ac_num desc";
$f_result=sql_query($query);
while($select_row = mysqli_fetch_array( $f_result)) {?>
<option value="<?=$select_row['ac_code']?>" date_1="<?=$select_row['start_date']?>" date_2="<?=$select_row['finish_date']?>"
<? if($select_row['ac_code'] == $ta_val){
echo "selected";
$date_1=$select_row['start_date'];
$date_2=$select_row['finish_date'];
}?>
>
<?//=$select_row['semester']?><?=$select_row['bachelor_name']?>
</option>
<?}?>
</select>
답변 1
예를 들어서 아래처럼 select 를 만든다고 한다면...
<select id=my name=you>
<option style=display:none>선택하세요</option>
<option>하나</option>
<option>둘</option>
<option>셋</option>
<option>넷</option>
<option>다섯</option>
</select>
여기에 id 를 가지고 자바스크립트를 한방 줘 보세요.
<select id=my name=you>
<option style=display:none>선택하세요</option>
<option>하나</option>
<option>둘</option>
<option>셋</option>
<option>넷</option>
<option>다섯</option>
</select>
<script>
my.value = "셋";
</script>
셀렉트에 셋이 자동으로 입력됩니다.
이걸 이용해서 name=you 로 전송시켜 db에 저장시키는 post 값을 $you 라고 한다면...
<select id=my name=you>
<option style=display:none>선택하세요</option>
<option>하나</option>
<option>둘</option>
<option>셋</option>
<option>넷</option>
<option>다섯</option>
</select>
<script>
my.value = "<?php echo $you; ?>";
</script>
위와 같은 형태로 만드는 것이 가장 쉽습니다.
물론 자바스크립트는 셀렉트 바로 하단에 위치시키는 것 보다는
</body> 마감 앞에서 사용하는 것이 관례적으로 맞구요.
그런데 최초에는 빈값인 "선택하세요"가 들어가야 하기 때문에
아래처럼 주는 것이 가장 무난하겠네요.
<select id=my name=you>
<option style=display:none>선택하세요</option>
<option>하나</option>
<option>둘</option>
<option>셋</option>
<option>넷</option>
<option>다섯</option>
</select>
<?php if ($you) echo "<script>my.value = '".$you."';</script>"; ?>
스크립트가
$(document).on('change','#sel_teacher',function(){
$("#tc_name").val($("#sel_teacher option:checked").text());
$("#tc_name_update").val($("#sel_teacher option:checked").attr("tc_name"));
var tc_id=$(this).val();
Ajax_teacher_select(tc_id);
});
$(document).on('change','#ac_code_sel',function(){
var ac_code_value=$(this).val();
$("#ac_code").val(ac_code_value);
var ac_sel=$("#ac_code_sel option:selected");
var ac_name_value= ac_sel.text();
$("#ac_box").empty();
$("#ac_box").append(ac_code_value+" "+ac_name_value);
var finish_date_date=ac_sel.attr("date_2");
var start_date=ac_sel.attr("date_1");
$("#datepicker1").val(start_date);
$("#datepicker2").val(finish_date_date);
});
이런식으로 잡혀있는데 방법이 있을까ㅣ요?
