html selectbox selected=true 설정

Question

퍼블에서 custom selectbox가 왔어요.코드 영역은 참고만하시고 넘어가주세요~아래는 js의 일부입니다.const customItemEvt = function () { $(el).on('click', '.custom-select-item a', function (e) { let $parent = $(this).closest('.custom-select'); idx = $(this).parent().index(); console.log($parent.html()); console.log(idx); $parent.find('.custom-select-real option').eq(idx).prop('selected', true); $parent.find('.custom-select-value').text($(this).text()); $parent.removeClass('active'); $(el).find('.custom-select-item').removeClass('active'); $(this).parent('.custom-select-item').addClass('active'); e.preventDefault(); }); }이런식으로 직접 태그를 만들고 active 속성도 강제로 줘요.근데, 문제는 ajax로 selectbox 값을 바꿔야한다는거에요.그래서 ajax에서 가져와서 이런식으로 넣어줬어요.$.ajax({ type : "POST", data : allData, dataType : "json", url : "/selectSkillCurgListAuto.do", success : function(data, status) { var resultList = data.curgList; var html = '' var html2 = "

교과군 선택

"; if(resultList.length > 0){ for(var i = 0; i < resultList.length; i++){ html += ""; html2 += "

"+resultList[i].gradeNm+"

"; } $("#curgCod").html(html); $("#chk_curgCod .custom-select-ui .custom-select-list").html(html2); console.log($("#chk_curgCod .custom-select-real option:eq(0)").html()); console.log($("#chk_curgCod .custom-select-real option:eq(1)").html()); console.log($("#chk_curgCod .custom-select-real option:eq(2)").html()); $("#chk_curgCod .custom-select-real option:eq(0)").prop("selected", true); }else{ alert("등록된 교과군이 없습니다."); } }, error : function(request, status){ console.log(status); } });그러면 실제 html은 이런식으로 표현됩니다. 이게 중요하죠 ㅎ

교과군 선택

교과군 선택
국어교과
수학교과

이제 본격적으로 제가 궁금한게 나오는데요,,두번째 코드 블럭안에 보면,$("#chk_curgCod .custom-select-real option:eq(0)").prop("selected", true);를 했는데 html 보면 적용이 안돼있어요. 왜 적용이 안될까요?이 코드 바로 윗줄의 console.log 들은 다 제대로 출력됩니다. html도 제조돼있고, 문법도 맞는데 왜 selected="true" 가 적용이 안될까요? ㅜㅜㅜ

html selectbox selected=true 설정

0개의 답변

Q&A 목록