다중 셀렉트 채택완료
amkor님께서 올리신 소스와 그 답변을 통해서 1차 셀렉트 박스에서 내용을 선택하면
2차 다중 셀렉트 박스 내용이 바뀌는 폼까지는 만들었는데
2차 다중 셀렉트 박스의 내용이 DB에 입력이 안됩니다.
고수님들 도움 부탁 드려요ㅜㅜ
<td> </td> <option value="">출발지 선택</option> <option value="지구" <? if($write[wr_5] == "지구") echo " selected "; ?>>지구</option> <option value="화성" <? if($write[wr_5] == "화성") echo " selected "; ?>>화성</option> <option value="우주" <? if($write[wr_5] == "우주") echo " selected "; ?>>우주</option> </select> </td> <th scope="row"><label for="wr_11">출발지</label></th> <td> <select name="wr_11" id="job1" style="height:20px;display:none"> <option value="">2차선택</option> <option value="aaa" <? if($write[wr_11] == "aaa") echo " selected "; ?>>aaa</option> <option value="bbb" <? if($write[wr_11] == "bbb") echo " selected "; ?>>bbb</option> </select> <select name="wr_11" id="job2" style="height:20px;display:none"> <option value="">2차선택</option> <option value="aaa" <? if($write[wr_11] == "aaa") echo " selected "; ?>>aaa</option> <option value="bbb" <? if($write[wr_11] == "bbb") echo " selected "; ?>>bbb</option> </select> <select name="wr_11" id="job3" style="height:20px;display:none"> <option value="">2차선택</option> <option value="eee" <? if($write[wr_11] == "eee") echo " selected "; ?>>eee</option> <option value="fff" <? if($write[wr_11] == "fff") echo " selected "; ?>>fff</option> </select> <script language="JavaScript"> <!-- function showSub(obj) { var frm = document.forms.article_searchFrm; if(obj == "지구") { document.getElementById("job1").style.display = "block"; document.getElementById("job1").disabled = false; document.getElementById("job2").style.display = "none"; document.getElementById("job2").disabled = true; document.getElementById("job3").style.display = "none"; document.getElementById("job3").disabled = true; } if(obj == "화성") { document.getElementById("job1").style.display = "none"; document.getElementById("job1").disabled = true; document.getElementById("job2").style.display = "block"; document.getElementById("job2").disabled = false; document.getElementById("job3").style.display = "none"; document.getElementById("job3").disabled = true; } if(obj == "우주"){ document.getElementById("job1").style.display = "none"; document.getElementById("job1").disabled = true; document.getElementById("job2").style.display = "none"; document.getElementById("job2").disabled = true; document.getElementById("job3").style.display = "block"; document.getElementById("job3").disabled = false; } }//--></script> </td>
상기 값에서 job1의 데이터는 db에 들어오는데 job2, job3이 안들어와요~ㅜ
답변 5개
공부할겸 하나 만들어 봤습니다.
참고해서 만드시면 될듯하네요 ....
<!-- jquery cdn jquery를 불러오고 있다면 사용하지 않으셔도 됩니다. --><script src="http://code.jquery.com/jquery-1.11.3.min.js"></script><!-- jquery cdn --> <div> <label for="wr_11">출발지</label> <select name="job" id="job" style="height:20px;display:"> <option value="지구" >지구</option> <option value="화성" >화성</option> <option value="우주" >우주</option> </select></div><div> <label for="wr_11">목적지</label> <select name="wr_11" id='wr_11' style="height:20px;"> <option value=''>출발지를 선택하세요</option> </select></div> <script language="JavaScript"> $("#job").change(function () { var job = $(this).val(); switch (job) { case "지구": $('#wr_11').find('option').remove(); $('#wr_11').append("<option value=''>2차선택</option>"); $('#wr_11').append("<option value='111'>111</option>"); $('#wr_11').append("<option value='222'>222</option>"); break; case "화성": $('#wr_11').find('option').remove(); $('#wr_11').append("<option value=''>2차선택</option>"); $('#wr_11').append("<option value='333'>333</option>"); $('#wr_11').append("<option value='444'>444</option>"); break; case "우주": $('#wr_11').find('option').remove(); $('#wr_11').append("<option value=''>2차선택</option>"); $('#wr_11').append("<option value='555'>555</option>"); $('#wr_11').append("<option value='666'>666</option>"); break; } });</script>
답변에 대한 댓글 2개
댓글을 작성하려면 로그인이 필요합니다.
ㅎㅎㅎ 다들 감사합니다;; 질문의 요지는 'DB에 DATA 값이 안들어오는데 뭐가 문제 인가?'였는데;;;
다들 폼을 작성을 해주셨네요;;; 아하하하하하;;;;;;
답변에 대한 댓글 1개
댓글을 작성하려면 로그인이 필요합니다.
<style type="text/css">
.second { display:none; }
</style>
<select name="" id="start">
<option value="">출발지 선택</option>
<option value="지구">지구</option>
<option value="화성">화성</option>
<option value="우주">우주</option>
</select>
<select name="wr_11" class="second">
<option value="">2차 선택</option>
<option value="aa">aa</option>
<option value="bb">bb</option>
</select>
<select name="wr_11" class="second">
<option value="">2차 선택</option>
<option value="cc">cc</option>
<option value="dd">dd</option>
</select>
<select name="wr_11" class="second">
<option value="">2차 선택</option>
<option value="ee">ee</option>
<option value="ff">ff</option>
</select>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$("#start").on("change", function() {
var $idx = $("option:selected", this).index() - 1;
$("select[name='wr_11']").each(function() {
$("select[name='wr_11']").css("display", "none").attr("disabled", true);
$("select[name='wr_11']").eq($idx).css("display", "block").attr("disabled", false);
});
});
});
</script>
선택한 애를 제외하고 다른 애들은 disabled만 해 주면 됩니다.
댓글을 작성하려면 로그인이 필요합니다.
wr_11 의 name값이 중복되어져 사용되고 있기때문에
hidden처리를 한다고 해도 맨 마지막 녀석의 값이 전송이 되기 때문입니다.
댓글을 작성하려면 로그인이 필요합니다.
답변에 대한 댓글 1개
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
사실 어제 이 소스 활용하다가 안되길래 안되는 줄 알았는데
알고보니 제가 잘못 활용하고 있었네요 ㅎㅎ 감사합니다~~~