{ 태그에 닫는 태그가 없습니다. error :295 대전홈페이지제작 하나솔루션 입력폼에 자동완성 기능 추가하는 방법
즐겨찾기

로고

전화걸기 토글 검색 토글 상단로그인 토글 네비게이션
디자인검색
A/S 신청하기
Home > 고객센터 > 자주 묻는 질문

자주 묻는 질문

분류목록

공통/일반 입력폼에 자동완성 기능 추가하는 방법

  • 하나솔루션
  • 2020-07-17 14:22:00
  • hit398

쇼핑몰 상품 검색 및  통합 게시판 검색폼에서 사용자가 단어를 입력하면 관련 검색어가 같이 표시되는 기능 입니다.

표시되는 기준은  [마케팅지원 > 마케팅지원 > 인기검색어 관리]에서 등록된 단어를 먼저 출력하며, 다음으로 실제 게시글 및 상품명등이 출력 됩니다.

[샘플소스] (그대로 복사 해서 사용가능합니다.)

 


 
  1. <style>
  2.  fieldset { position: relative; text-align: center; border: none; margin: 50px auto; width: 400px; padding: 0; }
  3.  .search { border: 3px solid #2db400; line-height: 30px; margin: 0; height: 30px;  padding: 0; width: 100%; text-indent: 10px; }
  4.  .search.type02 { border-color: #f26522; }
  5.  .search.type03 { border-color: #00bff3; }
  6.  ul  { display: none; position: absolute; top: 36px; left:0; right: 0; border: 1px solid #ccc; border-top: none; list-style: none; z-index: 9; background: #fff; padding: 10px; margin: 0; }
  7.  ul li { font-size: 9pt; text-decoration: none; text-align: left; line-height: 1.8em; }
  8.  ul li a { text-decoration: none; color: #333; }
  9.  ul li a strong { color: #ff7200; }
  10. </style>

     

  11.  

  12.  

  13.  
  14. <fieldset>
  15.  
  16. <input type="text" name="stx" id="stx1" class="search type01" value="" />
  17.  
  18. </fieldset>

     

  19.  

  20. <load target="/img_up/_addon/auto_complete/jquery.searchbox.min.js">

  21.  
  22. <script>
  23.  
  24. $(document).ready(function() {
  25.  
  26.  $('#stx1').searchBox({url : '/etc/auto_complete_exec.php?bbs_code=all'});
  27.  
  28. });
  29.  
  30. </script>

     

 

적용예시 :  http://wdev.webit.kr/page/auto

 

위 소스에서 /etc/auto_complete_exec.php 은 실제 검색어를 가져오는 부분 입니다.

이때 뒤쪽에 아래와 같이 변수를 전달하면 해당 되는 검색어만 가져 올수 있습니다.

사용가능한 변수 및 값 가져오는 검색어
shopping_goods_yn=1 쇼핑몰의 모든 상품명
bbs_code=all

게시판 제목 및 내용

all 입력시 모든 게시판을 가져오며, 아닌경우 해당 게시판만 가져 옵니다.
myboard_code=all

맞춤 게시판 제목 및 내용

all 입력시 모든 맞춤게시판을 가져오며, 아닌경우 해당 맞춤게시판만 가져 옵니다.

 

 

게시글 공유 URL복사
출력
목록
댓글[0]

열기 닫기

prev 이전글
실시간 상담 프로그램 설치하기
next 다음글
[고급사용자용] 통합 검색페이지 직접 만드는 방법
빠른 견적상담

HANASOLUTION

  • 상호 : 하나솔루션
  • 대표자: 정지혜
  • 주소: 대전광역시 서구 둔산중로 19 (탄방동, 샤크존) F15호
  • TEL. 1544-4928
  • FAX. 042-367-1040
  • hana07@kakao.com
  • 사업자 등록번호: 772-43-00228
  • 통신판매 신고번호: 2017-대전서구-0503
  • Copyright(c) 하나솔루션. All Rights Reserved.

SERVER LOCATION

서울시 서초구 서초동 1710-1 SK 브로드밴드 IDC 1층

이미지명

WORKING HOURS

  • 평일 : 오전9:00~오후 7:00
  • 점심 : 오후12:30~오후 2:00
  • 토.국경일 휴무

NAME SERVER

 1    ns1.webit.kr
  211.215.17.210
 2    ns1.webit.kr
  211.215.17.212
사업자등록증다운받기
통장사본 다운로드
상단으로 바로가기