> 백엔드 개발 > PHP 문제 > 쿼리 조건을 저장하기 위한 버튼 클릭 기능을 PHP에서 구현하는 방법에 대한 간략한 분석

쿼리 조건을 저장하기 위한 버튼 클릭 기능을 PHP에서 구현하는 방법에 대한 간략한 분석

PHPz
풀어 주다: 2023-04-04 16:26:01
원래의
765명이 탐색했습니다.

웹사이트의 검색 페이지에서 검색 조건을 저장하기 위해 버튼을 클릭하는 기능을 구현해야 하는 경우가 많습니다. 프로그래밍 언어로서 PHP는 이 기능을 쉽게 구현할 수 있습니다. 이번 글에서는 버튼을 클릭하여 쿼리 조건을 저장하는 기능을 PHP에서 구현하는 방법을 소개하겠습니다.

1. 문제 설명

많은 웹사이트의 검색 페이지에서 "쿼리 조건 저장" 버튼과 같은 일부 버튼을 볼 수 있습니다. 이 버튼의 기능은 현재 검색 조건을 저장하여 나중에 다시 검색할 때 재입력 없이 해당 조건을 바로 불러올 수 있도록 하는 것입니다.

2. 솔루션

이 기능을 구현하는 방법은 여러 가지가 있지만 이 문서에서는 이를 구현하기 위해 PHP 세션을 사용하겠습니다. 세션은 서버 측에 정보를 저장하는 기술로, 세션 변수를 설정하여 사용자 데이터를 영구적으로 저장할 수 있습니다. 사용자가 브라우저를 닫으면 세션이 자동으로 삭제됩니다. 쿼리 조건을 저장하기 위해 버튼을 클릭하는 기능을 구현하기 위해 PHP의 세션을 사용하는 방법을 소개하겠습니다.

  1. 검색 페이지 만들기

먼저 아래와 같이 일부 검색 조건과 "쿼리 조건 저장" 버튼이 포함된 검색 페이지를 만들어야 합니다.

<html>
<head>
    <title>搜索页面</title>
</head>
<body>
    <form method="get" action="result.php">
        <label>关键字:</label>
        <input type="text" name="keyword"><br>
        <label>日期:</label>
        <input type="date" name="date"><br>
        <label>类型:</label>
        <select name="type">
            <option value="1">新闻</option>
            <option value="2">论文</option>
            <option value="3">博客</option>
        </select><br>
        <input type="submit" value="搜索">
        <input type="button" value="保存查询条件" onclick="saveSearch()">
    </form>
</body>
</html>
로그인 후 복사

이 페이지에서는 HTML 양식 태그를 사용합니다. 검색 양식을 만들고 일부 HTML 요소를 사용하여 검색 조건을 입력합니다. 마지막 입력 태그에서 onclick 이벤트를 설정했습니다. 사용자가 "쿼리 조건 저장" 버튼을 클릭하면 이 이벤트가 JavaScript 함수 saveSearch()를 트리거합니다.

  1. JavaScript 함수 작성

이전 단계에서는 JavaScript 함수 saveSearch()를 트리거하는 onclick 이벤트를 설정했습니다. 이 함수를 구현해 보겠습니다. 이 함수의 기능은 현재 검색 조건을 PHP 세션에 저장하는 것입니다.

<script>
function saveSearch() {
    var keyword = document.getElementsByName("keyword")[0].value;
    var date = document.getElementsByName("date")[0].value;
    var type = document.getElementsByName("type")[0].value;
    var search = {"keyword": keyword, "date": date, "type": type};
    var searchStr = JSON.stringify(search);
    sessionStorage.setItem("search", searchStr);
}
</script>
로그인 후 복사

이 함수에서는 먼저 사용자가 입력한 검색어를 가져온 다음 이를 JavaScript 개체 검색에 저장합니다. 다음으로 JSON.stringify를 사용하여 이 개체를 JSON 문자열로 변환하고 "search"라는 이름으로 PHP 세션에 저장합니다.

  1. 검색 조건 로드

사용자가 다시 검색할 때 이전에 저장된 검색 조건을 PHP 세션에서 로드해야 합니다. 검색 결과 페이지에 PHP 코드를 추가하여 다음 조건을 로드할 수 있습니다.

<?php
session_start();
if (isset($_SESSION[&#39;search&#39;])) {
    $search = json_decode($_SESSION[&#39;search&#39;], true);
    $keyword = $search[&#39;keyword&#39;];
    $date = $search[&#39;date&#39;];
    $type = $search[&#39;type&#39;];
}
?>
로그인 후 복사

이 코드에서는 먼저 session_start() 함수를 호출하여 세션을 연 다음 $_SESSION['search']가 존재하는지 확인합니다. . 존재한다면 검색 조건이 이전에 저장되었다는 의미입니다. json_decode를 사용하여 저장된 JSON 문자열을 PHP 배열로 변환하고 여기에서 키워드, 날짜 및 유형을 가져옵니다. 이 값은 검색 양식의 입력 및 선택 상자를 초기화하는 데 사용할 수 있습니다.

  1. 로드된 검색 기준 사용

마지막으로 로드된 검색 기준을 사용하여 검색 작업을 수행해야 합니다. 검색 페이지의 form 태그에 JavaScript 함수 initSearch()를 추가하여 검색 조건을 초기화할 수 있습니다.

<script>
function initSearch() {
    <?php
    if (isset($keyword)) {
        echo "document.getElementsByName(&#39;keyword&#39;)[0].value = &#39;$keyword&#39;;";
    }
    if (isset($date)) {
        echo "document.getElementsByName(&#39;date&#39;)[0].value = &#39;$date&#39;;";
    }
    if (isset($type)) {
        echo "document.getElementsByName(&#39;type&#39;)[0].value = &#39;$type&#39;;";
    }
    ?>
}
</script>
로그인 후 복사

이 함수는 페이지가 로드될 때 실행되며 검색 조건의 값을 해당 입력 상자에 할당하고 선택 상자. 양식 태그에 onload 이벤트만 추가하면 됩니다:

<form method="get" action="result.php" onload="initSearch()">
로그인 후 복사

이렇게 하면 사용자가 검색 페이지에 액세스할 때 이전에 검색 조건이 저장되어 있었다면 해당 조건이 해당 입력 상자 및 선택 상자로 초기화됩니다. , 및 사용자 검색 작업에 직접 사용할 수 있습니다.

3. 요약

PHP 세션을 통해 검색 조건을 저장하고, 다음 검색 시 저장된 조건을 직접 로드하여 사용자가 빠르게 검색 작업을 수행할 수 있도록 하는 방법을 소개합니다. 이 기능은 사용자의 검색 경험에 매우 도움이 되며, 사용자 입력 수를 줄이고 사용자 만족도를 향상시킵니다.

위 내용은 쿼리 조건을 저장하기 위한 버튼 클릭 기능을 PHP에서 구현하는 방법에 대한 간략한 분석의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿