일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | ||||
4 | 5 | 6 | 7 | 8 | 9 | 10 |
11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 | 19 | 20 | 21 | 22 | 23 | 24 |
25 | 26 | 27 | 28 | 29 | 30 | 31 |
Tags
- linux
- 명령어
- BindingResult
- 비밀번호 변경 명령어
- 자바스크립트 인라인
- 개발시작전 자세
- js
- 추천 사이트
- 하모니카 OS 5
- StringUtils.hasText
- 스프링부트
- JSON
- Intellij
- #{..}
- 프로젝트 클린
- select
- 타임리프
- Test 룸북 사용하기
- 룸북
- 시퀀스 조회
- 리눅스
- 순서 보장
- 다른사람 프로젝트 수정전 가져야할 자세
- cmd
- 타임리프와 스프링
- 추천 프로그램
- Java
- it
- 설정
- 함수 인자값 id
Archives
- Today
- Total
웹개발 블로그
[jQuery] (중요)confrim()과 type="radio" 본문
<input type="hidden" id="c_pick_up_temp" value="${hospitalView.c_pick_up}">
...
<td>
<input type="radio" name="c_pick_up" id="pick_up_daytime" value="0" onclick="return confirmChnPickUp(0);" <c:if test="${hospitalView.c_pick_up eq '0'}">checked</c:if>>
<label for="pick_up_daytime" style="margin-right: 5px;">주간</label>
<!-- 저녁수거 선택 시 LBX필드 또는 24/7 병원인지 체크된 내용만 저녁수거 선택가능(검사 필수!)-->
<input type="radio" name="c_pick_up" id="pick_up_dinner" value="1" onclick="return confirmChnPickUp(1);" <c:if test="${hospitalView.c_pick_up eq '1'}">checked</c:if>>
<label for="pick_up_dinner">야간</label>
</td>
...
상황 : radio버튼 값을 변경하면 -> 변경하시겠습니까? 여쭤봐야하며
팝업창이 뜨며 esc 또는 취소 버튼을 누르면 선택한 값으로 변경되면 안된다!!!
function confirmChnPickUp(c_pick_up) {
//console.log("기존 값=> "+$("#c_pick_up_temp").val());
if(confirm("변경하시겠습니까?")){
//확인(true)
$("#c_pick_up_temp").val(c_pick_up);//기존 값 변경
//console.log("기존 값 변경(temp) => "+$("#c_pick_up_temp").val());
//console.log("기존 값 변경 전 => "+$(":input:radio[name=c_pick_up]").val());
$(":input:radio[name=c_pick_up]").val($("#c_pick_up_temp").val());//기존값 변경
//console.log("기존 값 변경 후 => "+$(":input:radio[name=c_pick_up]").val());
if(!dinnerCheck(c_pick_up)){
return;
}
}else{
//취소(false)
if(window.event.keyCode==27){//ESC
$(":input:radio[name=c_pick_up]").val($("#c_pick_up_temp").val()).trigger('change');
//console.log("강제 변경(temp)=> "+$("#c_pick_up_temp").val());
//console.log("강제 변경=> "+$(":input:radio[name=c_pick_up]").val());
return false;
}else{
$(":input:radio[name=c_pick_up]").val($("#c_pick_up_temp").val()).trigger('change');
//console.log("강제 변경(temp)=> "+$("#c_pick_up_temp").val());
//console.log("강제 변경=> "+$(":input:radio[name=c_pick_up]").val());
return false;
}
}
}
하지만!!!!
confrim()함수를 사용 후
확인(true)
취소(false)
중
💥🔰취소를 눌러도 변경한 값으로 클릭이 된다!!!!!!.(한참을 고생했다ㅠㅠㅠㅠ)💥🔰
- 이유는 corfirm함수는 체크하는 기능들이랑 같이 사용시 잘 안된다....(값 변경도 취소도..)
[문제점 정리]
- 기존값을 가지고 있다가 ese 또는 취소 버튼을 클릭 시 강제로 클릭하게 할거며
- true여도 값이 변경이 안되는 상황도 보였다!!! <-- 라디오 값도 변경해줄 거다.
그럴때는 강제 trigger()함수를 사용하여
기존 값을저장한 뒤에 그 값을 넣어주면 된다.
[✨해결✨]
① 원래 값으로 강제 클릭 -> $(":input:radio[name=c_pick_up]").val($("#c_pick_up_temp").val()).trigger("chage"));
② 기존값 변경 -> $(":input:radio[name=c_pick_up]").val($("#c_pick_up_temp").val());
'◆JavaScript > jQuery' 카테고리의 다른 글
[jQuery] CDN (0) | 2023.02.09 |
---|---|
[jQuery] 체크박스 배열 유효성 검사 (0) | 2023.02.03 |
[jQuery] 라디오버튼 또는 체크박스 값 가져오기 및 체크 해제하기 (0) | 2023.02.03 |
[jQuery]파라미터로 받아온 id인자 값을 셀렉터 jquery 사용 방법 (0) | 2023.02.01 |
[jQuery] 최신 버전 선언 (0) | 2023.01.19 |