한글자음 버튼 눌러도 영어카테고리가 나오게 하는 방법
본문
안녕하세요, 현재 영어카테고리로 (A~Z) 브랜드 카테고리를 나눠놨는데요
영어 철자 a를 누르면 apple 같은 브랜드 카테고리가 팝업되는데
한글 철자 ㅇ를 눌러도 apple(애플) 브랜드 카테고리가 팝업되게 하고 싶습니다
고도몰측에 문의했더니 세부코딩사항은 못 알려준다고 하고..
예시 한줄만 있어도 따라할 것 같은데 정보도 없구 ㅜ
아래는 현 코딩 소스입니다.
너무 답답한 마음에 커뮤니티 뒤지다 이곳을 찾았구요
문제시 삭제하겠습니다
{*** 브랜드 리스트 | goods/goods_list.php ***}
{ # header }
<div class="content_box">
<div class="goods_brand">
<div class="goods_brand_tit">
<h2>{=__('브랜드')}</h2>
</div>
<div class="goods_brand_cont">
<div class="brand_all_list">
<div class="brand_search_box">
<input type="text" title="{=__('브랜드명 검색')}" placeholder="{=__('브랜드명 검색')}" id="brand_search" autocomplete="off"/>
<input type="image" src="../img/common/btn/btn_top_search_gray.png" id="" class="btn_brand_search" title="{=__('검색')}" value="{=__('검색')}" alt="{=__('검색')}"/>
</div>
<div>
<button type="button" class="bnt_all_brand on" data-key="">{=__('전체')}</button>
<!--{ @ korea_alphabet }-->
<button type="button" data-key="{=.value_}">{=.value_}</button>
<!--{ / }-->
</div>
<div class="alphabet">
<button type="button" class="all" data-key="etc">{=__('기타')}</button>
<!--{ @ english_alphabet }-->
<button type="button" data-key="{=.value_}">{=.value_}</button>
<!--{ / }-->
</div>
</div>
<!-- //brand_all_list -->
<div class="gnb_allmenu_box">
<div class="gnb_scroll_box">
<ul id="brandArea">
</ul>
</div>
<div class="no_list">
{=__('검색결과가 없습니다.')}
</div>
</div>
</div>
<!-- //goods_brand_cont -->
</div>
<!-- //goods_brand -->
</div>
<!-- //content_box -->
<script type="text/javascript">
<!--
$(document).ready(function(){
$('.brand_all_list button').on('click', function(){
$('.brand_all_list button').removeClass('on');
$(this).addClass('on');
show_brand($(this).data('key'), false);
});
show_brand('', false);
$("#brand_search").on({
'keyup':function(e){
if(e.keyCode == 13) show_brand($(this).val(), true);
}
});
$('.btn_brand_search').on({
'click':function(e){
show_brand($("#brand_search").val(), true);
}
});
});
function show_brand(brand, search)
{
if(search && !$.trim(brand)) {
alert(__('브랜드명을 입력해주세요.'));
return false;
}
var data = {
'mode' : 'get_brand',
'brand' : brand,
}
if(search) data.search = true;
$.ajax({
method: "POST",
cache: false,
url: "./goods_ps.php",
data: data,
success: function(data) {
$(".no_list").hide();
var getData = $.parseJSON(data);
if(data =='false') {
$("#brandArea").html('');
$(".no_list").show();
} else {
var addHtml = "";
$.each(getData, function (brandKey, brandVal) {
$.each(brandVal, function (key, val) {
addHtml += '<li style="width:20%;"><div class="all_menu_cont"><a href="../goods/goods_list.php?brandCd='+val.cateCd+'">'+val.cateNm+'</a>';
if(val.children) {
addHtml += '<ul class="all_depth1">';
$.each(val.children, function (key1, val1) {
addHtml += '<li><a href="../goods/goods_list.php?brandCd='+val1.cateCd+'">'+val1.cateNm+'</a>';
if(val1.children) {
addHtml += '<ul class="all_depth2">';
$.each(val1.children, function (key2, val2) {
addHtml += '<li><a href="../goods/goods_list.php?brandCd='+val2.cateCd+'">'+val2.cateNm+'</a></li>';
});
addHtml += '</ul>';
}
addHtml += '</li>';
});
addHtml += '</ul>';
}
addHtml += '</div></li>';
});
});
$("#brandArea").html(addHtml);
}
},
error: function (data) {
alert(data.message);
}
});
}
//-->
</script>
{ # footer }
