Jquery 자동완성 검색기능 추가하기 (Autocomplete) 한글호환

Jquery 자동완성 검색기능 추가하기 (Autocomplete) 한글호환

QA

Jquery 자동완성 검색기능 추가하기 (Autocomplete) 한글호환

본문

오토컴플리트가 한글을 완벽히 호환하지 못합니다.

어떤 방법 있으시면 공유 부탁드려요.

문제는 전지적을 검색하면 가끔 전지저로 검색이 됩니다. 항상 그러지는 않아요 ㅡ.ㅡ

한글만 그러네요.

 

<script>
$(document).ready(function() {

    // 오토컴플리트 (검색어 자동완성)
    $("#thema_wrapper").on("keyup", "#stx", function(){
        var stx = $(this).val(); /* 입력한 검색어 */
        $(this).autocomplete({
            source:function(request, response) {
                $.getJSON(g5_url+"/_search_popular.php", {
                    /* _search_popular.php 파일로 넘길 변수값을 이곳에 작성하시면 됩니다. GET 으로 넘어갑니다. */
                    /* 콤마로 구분하시면 되요 ex) sfl:"wr_subject", stx:stx, ........ */
                    stx : stx
                }, response);
            },
            minLength:2, /*최소 검색 글자수*/
            delay: 150,  /* 검색어 입력후 표시되는 시간 - 숫자가 클수록 느리게 출력 */
            focus:function(event, ui) {
                /* 검색을 통하여 넘어온 값을 여기서 처리 */
                console.log(ui.item.value); /* 콘솔 확인용이므로 삭제하거나 주석처리 하여도 됩니다. */
            },
            close:function(event, ui) {

            }
        })
    });
    // 오토컴플리트 종료

});
</script>

 

<?php
include_once('./_common.php');
$stx = $_GET['stx'];
$sql = "select
            distinct(pp_word)
        from
            g5_popular
        where
            pp_word like '%".$stx."%'
        group by
            pp_word
        order by
            pp_word asc limit 10 ";
$result = sql_query($sql,true);
// value : 검색된 단어이며, input 값으로 넘어갑니다.
// label : 특정검색어를 입력시 자동완성 리스트로 표시됩니다. (다양하게 응용가능)
while($row=sql_fetch_array($result)) {
    $arr[] = array(
                "value"    => $row['pp_word'],
                "label"    => $row['pp_word']
                );
}
echo json_encode($arr);
?>

이 질문에 댓글 쓰기 :

답변 1

해결 했습니다.

autocomplete가 버전업하면서 생긴 버그라네요.

                event.preventDefault();

삽입해 주니까 문제 없습니다.

 

<script>
$(document).ready(function() {

    // 오토컴플리트 (검색어 자동완성)
    $("#thema_wrapper").on("keyup", "#stx", function(){
        var stx = $(this).val(); /* 입력한 검색어 */
        $(this).autocomplete({
            source:function(request, response) {
                $.getJSON(g5_url+"/_search_popular.php", {
                    /* _search_popular.php 파일로 넘길 변수값을 이곳에 작성하시면 됩니다. GET 으로 넘어갑니다. */
                    /* 콤마로 구분하시면 되요 ex) sfl:"wr_subject", stx:stx, ........ */
                    stx : stx
                }, response);
            },
            minLength:2, /*최소 검색 글자수*/
            delay: 150,  /* 검색어 입력후 표시되는 시간 - 숫자가 클수록 느리게 출력 */
            focus:function(event, ui) {
                event.preventDefault();
                /* 검색을 통하여 넘어온 값을 여기서 처리 */
//                console.log(ui.item.value); /* 콘솔 확인용이므로 삭제하거나 주석처리 하여도 됩니다. */
            },
            close:function(event, ui) {

            }
        })
    });
    // 오토컴플리트 종료

});
</script>

답변을 작성하시기 전에 로그인 해주세요.
전체 123,673 | RSS
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT