게시판 검색 이 입력란을 작성하세요 수정 문의드립니다.

매출이 오르면 내리는 수수료! 지금 수수료센터에서 전자결제(PG)수수료 비교견적 신청해 보세요!
게시판 검색 이 입력란을 작성하세요 수정 문의드립니다.

QA

게시판 검색 이 입력란을 작성하세요 수정 문의드립니다.

답변 2

본문

안녕하세요 !

밑 이미지를 게시판 검색시 돋보기를 누르면 뜨는 이입력란을 작성하세요를  영문으로 수정하고

싶은데 경로를 아무리 뒤져봐도 찾지를 못하고있어요.

고수님들 제발 부탁드립니당  어느 파일에서 수정을 해야하는지 도와주세요 ㅠㅠㅠㅠ 

 

3034737284_1732354962.3037.png

이 질문에 댓글 쓰기 :

답변 2

브라우저 언어 설정에 따라 브라우저가 자동으로 띄우는 메시지라서, 그냥 두시면 됩니다

신비님 말씀대로 브라우저 메시지기때문에 하단검색 스크립트 jQuery(function($) 검색하셔서 이스크립트 안에다 다음과 같이 추가해보세요.


document.querySelector("form[name='fsearch']").addEventListener("submit", function(event) {
    var input = document.getElementById("stx");
    if (!input.value.trim()) {
        event.preventDefault();
        alert("이 입력란 을 작성하세요 이것을 원하는 영문으로 바꿔주세요");
        input.focus();
    }
});

. . . """밑 이미지를 게시판 검색시 돋보기를 누르면 뜨는""" 누르면 뜨는 것이 아니고,

    브라우저의 빈 입력창 어디에서나 mouse hover시, 나타나는 메시지입니다.

 

※ 이 메시지는 브라우저가 클라이언트 언어 설정에 따라 표시하며,

   placeholder가 아닌 '브라우저 기본 메시지'를 수정할 필요는 없습니다.

  > 브라우저의 빈 입력창 메시지인 "이 입력란을 작성하세요."는

     HTML의 required 속성으로 인해 나타나는 기본 메시지입니다.

    > 사용자 정의 로직이 있다고 하나,  

      - 브라우저의 기본 동작을 막고 사용자 정의 메시지를 적용해야할 필요가 있나요?

 

 

. . . 아래는 그누보드에서 '검색 경고 메시지'와 placeholder를 변경하는 방법입니다.

      - 브라우저의 빈 입력창 메시지("이 입력란을 작성하세요.") 아님.

 

placeholder메시지를 개발자가 일관된 사용자 경험(특정 구문)으로 원하는 경우.

  개발자가 지정한 내용으로 표시할 수 있습니다.

 

  > 클라이언트가 특정 요청(검색)을 할 때, 

    브라우저에서 실행되는 HTML 문서 내에 포함되는

    Form의 placeholder메시지 구문은 변경할 수 있습니다.

 

※ 검색과 관련된 스킨 파일은 /skin/search/basic/search.skin.php 파일입니다.

  - 아래는 5.6.4 기본 소스를 변경한 코드입니다. - 대부분의 버전에 호환 됨.

  - 참고하여 수정해 보세요.


<?php
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
// add_stylesheet('css 구문', 출력순서); 숫자가 작을수록 먼저 출력됨
add_stylesheet('<link rel="stylesheet" href="'.$search_skin_url.'/style.css">', 0);
?>
<!-- 전체검색 시작 { -->
<form name="fsearch" onsubmit="return fsearch_submit(this);" method="get">
    <input type="hidden" name="srows" value="<?php echo $srows ?>">
    <fieldset id="sch_res_detail">
        <legend>상세검색</legend>
        <?php echo $group_select ?>
        <script>document.getElementById("gr_id").value = "<?php echo $gr_id ?>";</script>
        <label for="sfl" class="sound_only">검색조건</label>
        <select name="sfl" id="sfl">
            <option value="wr_subject||wr_content"<?php echo get_selected($sfl, "wr_subject||wr_content") ?>>제목+내용</option>
            <option value="wr_subject"<?php echo get_selected($sfl, "wr_subject") ?>>제목</option>
            <option value="wr_content"<?php echo get_selected($sfl, "wr_content") ?>>내용</option>
            <option value="mb_id"<?php echo get_selected($sfl, "mb_id") ?>>회원아이디</option>
            <option value="wr_name"<?php echo get_selected($sfl, "wr_name") ?>>이름</option>
        </select>
        <label for="stx" class="sound_only">검색어<strong class="sound_only"> 필수</strong></label>
        <span class="sch_wr">
            <!-- 
            기존 검색 필드에서 placeholder 추가- 약 27번째 line
            사용자 경험을 개선하기 위해  '일관된 사용자 경험(특정 구문)' 메시지를 사용
            -->
            <input type="text" name="stx" value="<?php echo $text_stx ?>" id="stx" required class="frm_input" size="40" placeholder="일관된 사용자 경험(특정 구문)">
            
            <!-- 
            버튼 클릭 시 입력값 검증을 수행하는 JavaScript 함수 추가 
            -->
            <button type="submit" class="btn_submit" onclick="return validateInput();">
                <i class="fa fa-search" aria-hidden="true"></i> 검색
            </button>
        </span>
        <!-- JavaScript로 입력값 검증 로직 추가 -->
        <script>
        /**
         * 검색 입력값 검증 함수
         * - 빈 입력 필드에 대해 경고 메시지를 표시합니다.
         */
        function validateInput() {
            const searchInput = document.getElementById('stx').value.trim();
            if (!searchInput) {
                alert('Hey buddy, please enter your search term. -참신한삼치'); // 검색어 입력 경고 
                return false; // 폼 제출 방지
            }
            return true; // 정상적으로 폼 제출
        }
        function fsearch_submit(f) {
            const stx = f.stx.value.trim();
            if (stx.length < 2) {
                alert("검색어는 두글자 이상 입력하십시오."); // 기존 메시지 유지
                f.stx.select();
                f.stx.focus();
                return false;
            }
            // 검색어 내 공백 검증 로직
            let cnt = 0;
            for (let i = 0; i < stx.length; i++) {
                if (stx.charAt(i) === ' ') cnt++;
            }
            if (cnt > 1) {
                alert("빠른 검색을 위하여 검색어에 공백은 한 개만 입력할 수 있습니다.");
                f.stx.select();
                f.stx.focus();
                return false;
            }
            f.stx.value = stx;
            return true;
        }
        </script>
        <div class="switch_field">
            <input type="radio" value="and" <?php echo ($sop == "and") ? "checked" : ""; ?> id="sop_and" name="sop">
            <label for="sop_and">AND</label>
            <input type="radio" value="or" <?php echo ($sop == "or") ? "checked" : ""; ?> id="sop_or" name="sop">
            <label for="sop_or">OR</label>
        </div>
    </fieldset>
</form>

 

♣ 위의 페이지에서 가능. - 약 27번 line - placeholder 내용


            <input type="text" name="stx" value="<?php echo $text_stx ?>" id="stx" required class="frm_input" size="40" placeholder="일관된 사용자 경험(특정 구문)">

 

♣ 위의 페이지에서 가능. - 약 45번 line - 빈 검색어 입력창 메시지


                alert('Hey buddy, please enter your search term. -참신한삼치');

 

ex ; https://glitter.kr/gate/_board_5348164a0c8ca0db83af330e124_BMa83WeC_e9ae46cf7c940b10963820df4c0b7693ea052754/search.php?sfl=wr_subject%7C%7Cwr_content&sop=and&stx=

 

답변을 작성하시기 전에 로그인 해주세요.
QA 내용 검색
질문등록
전체 2
© SIRSOFT
현재 페이지 제일 처음으로