버튼 선택 취소? 문의드립니다.
본문
안녕하세요 ~! 저희 자사몰에
월렌탈료 클릭시 아래 가격대별에 금액이 자동으로 들어가서 검색할수있게끔 구현을 해놨습니다.
예시) 1만원대 선택시 500,000 ~ 900,000
2만원대 선택시 980,000 ~ 1,500,000
이런식으로 가격대별에 자동으로 기입되게끔 되어있는데
버튼을 한번더 클릭해서 실행해제를 하면 가격대별에 금액이 기입되었던게 사라졌으면 좋겠는데...
가능할까요??
답변 5
$(document).on('change','[name^=filter_rental]',function () {
$('#priceMin').val("0"); //최소가격 초기화
$('#priceMax').val("0"); //최고가격 초기화
$('[name^=filter_rental]').not(this).prop('checked', false);
if($(this).attr('id').replace(/[^0-9]/g,'') === "1" && $(this).prop('checked') === true) {
$('#priceMin').val("500000");
$('#priceMax').val("873000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "2" && $(this).prop('checked') === true) {
$('#priceMin').val("874000");
$('#priceMax').val("1311000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "3" && $(this).prop('checked') === true) {
$('#priceMin').val("1312000");
$('#priceMax').val("1749000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "4" && $(this).prop('checked') === true) {
$('#priceMin').val("1750000");
$('#priceMax').val("2187000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "5" && $(this).prop('checked') === true) {
$('#priceMin').val("2188000");
$('#priceMax').val("3501000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "6" && $(this).prop('checked') === true) {
$('#priceMin').val("3502000");
$('#priceMax').val("4377000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "7" && $(this).prop('checked') === true) {
$('#priceMin').val("4378000");
$('#priceMax').val("50000000");
}
});
이렇게 해보십시요.
오 감사합니다!!
* 월렌탈료 선택시
*/
$(document).on('change','[name^=filter_rental]',function () {
$('#priceMin').val(""); //최소가격 초기화
$('#priceMax').val(""); //최고가격 초기화
$('[name^=filter_rental]').not(this).prop('checked', false);
if($(this).attr('id').replace(/[^0-9]/g,'') === "1" && $(this).prop('checked') === true) {
$('#priceMin').val("500000");
$('#priceMax').val("873000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "2" && $(this).prop('checked') === true) {
$('#priceMin').val("874000");
$('#priceMax').val("1311000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "3" && $(this).prop('checked') === true) {
$('#priceMin').val("1312000");
$('#priceMax').val("1749000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "4" && $(this).prop('checked') === true) {
$('#priceMin').val("1750000");
$('#priceMax').val("2187000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "5" && $(this).prop('checked') === true) {
$('#priceMin').val("2188000");
$('#priceMax').val("3501000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "6" && $(this).prop('checked') === true) {
$('#priceMin').val("3502000");
$('#priceMax').val("4377000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "7" && $(this).prop('checked') === true) {
$('#priceMin').val("4378000");
$('#priceMax').val("50000000");
}
});
말씀해주신데로 하니깐 클릭해제시 0 숫자가나와서 빼고 적용하니깐
금액이 전부 빠지네요!! 감사합니다!
버튼의 선택유무를 확인해서 해당 input의 값을 0으로 변경하면 됩니다.
버튼클릭시 금액이 입력되는 스크립트를 찾아서 분석해보면 어떻게 해야 될지 알 수 있을 것입니다.
* 월렌탈료 선택시
*/
$(document).on('change','[name^=filter_rental]',function () {
$('[name^=filter_rental]').not(this).prop('checked', false);
if($(this).attr('id').replace(/[^0-9]/g,'') === "1") {
$('#priceMin').val("500000");
$('#priceMax').val("873000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "2") {
$('#priceMin').val("874000");
$('#priceMax').val("1311000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "3") {
$('#priceMin').val("1312000");
$('#priceMax').val("1749000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "4") {
$('#priceMin').val("1750000");
$('#priceMax').val("2187000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "5") {
$('#priceMin').val("2188000");
$('#priceMax').val("3501000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "6") {
$('#priceMin').val("3502000");
$('#priceMax').val("4377000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "7") {
$('#priceMin').val("4378000");
$('#priceMax').val("50000000");
}
});
해당부분 소스가 이렇게되어있는거같습니다.
네
JavaScript 전역변수
혹은 input hidden값 등을 이용해서
버튼 선택여부를 1선택,0미선택으로 기록해두고
클릭시
변수값을 보고 0이면 1을 넣고 선택으로 변경해주고 위의 조건을 처리합니다.
변수값이 0이 아니면 0을 넣고 선택을 해제해주고 위의 영역값을 초기화 해줍니다.
값변경시 일단 초기화 처리하고 시작하는 것도 괜찮아 보이네요
$(document).on('change','[name^=filter_rental]',function () {
$('#priceMin').val("0"); //최소가격 초기화
$('#priceMax').val("0"); //최고가격 초기화
$('[name^=filter_rental]').not(this).prop('checked', false);
if($(this).attr('id').replace(/[^0-9]/g,'') === "1") {
$('#priceMin').val("500000");
$('#priceMax').val("873000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "2") {
$('#priceMin').val("874000");
$('#priceMax').val("1311000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "3") {
$('#priceMin').val("1312000");
$('#priceMax').val("1749000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "4") {
$('#priceMin').val("1750000");
$('#priceMax').val("2187000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "5") {
$('#priceMin').val("2188000");
$('#priceMax').val("3501000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "6") {
$('#priceMin').val("3502000");
$('#priceMax').val("4377000");
}else if($(this).attr('id').replace(/[^0-9]/g,'') === "7") {
$('#priceMin').val("4378000");
$('#priceMax').val("50000000");
}
});
이렇게 한번 해보십시요
이렇게 해봤는데 안되네요 ㅠㅠ ...
하단에
/**
* n 줄 정렬
*/
$(document).on('change','[name=page_rows]',function() {
let url = $(this).val();
if (url !== '') {
window.location = url;
}
return false;
});
/**
* sort 표시하기
*/
if(getQueryParam('sort')) {
$('.sct_sort_wrap li').each(function () {
if($(this).data('sort') === getQueryParam('sort') && $(this).data('sortodr') === getQueryParam('sortodr')) {
$(this).addClass('on');
}
});
}
})
이부분이 있는데 관여가 되어있는부분일까요?
하단 내용은 관련이 없습니다.
답변을 작성하시기 전에 로그인 해주세요.
