>데이터 베이스 >MySQL 튜토리얼 >jQuery AJAX를 사용하여 MySQL 데이터를 어떻게 검색할 수 있나요?

jQuery AJAX를 사용하여 MySQL 데이터를 어떻게 검색할 수 있나요?

Linda Hamilton
Linda Hamilton원래의
2024-12-14 18:26:15184검색

How Can I Retrieve MySQL Data Using jQuery AJAX?

jQuery AJAX를 사용하여 MySQL에서 데이터 검색

웹 애플리케이션의 상호 작용을 향상하려면 전체 페이지를 새로 고치지 않고 서버와 통신할 수 있는 강력한 방법이 필요합니다. . jQuery AJAX는 비동기 요청을 보내고 서버의 응답을 처리하여 이 기능을 제공합니다. 이 경우 MySQL 데이터베이스에서 데이터를 검색하는 것이 목표입니다.

list.php에 제공된 코드 조각은 jQuery AJAX를 사용하여 레코드를 검색하려고 시도하지만 제대로 작동하지 않습니다. 이 문제를 해결하기 위해 우리는 MySQL 테이블에서 데이터를 성공적으로 검색하는 향상된 버전을 제작할 것입니다.

JavaScript 코드:

<script type="text/javascript">
$(document).ready(function() {
  $("#display").click(function() {
    $.ajax({
      type: "GET",
      url: "Records.php", 
      dataType: "html", 
      success: function(response) {                    
          $("#responsecontainer").html(response); 
      }
    });
  });
});
</script>

설명:

  • 문서 준비 기능은 DOM이 완전히 완료되면 JavaScript 코드가 실행되도록 보장합니다. 로드됩니다.
  • "표시" 버튼을 클릭하면 $.ajax() 함수를 사용하여 AJAX 요청이 시작됩니다.
  • 요청은 다음을 사용하여 "Records.php" 스크립트로 전송됩니다. GET 메소드.
  • 우리는 dataType: "html"로 표시되는 HTML 데이터를 응답으로 수신할 것으로 예상합니다. 설정.
  • 응답이 성공하면(HTTP 상태 코드 200) 응답이 "responsecontainer" div 요소에 채워져 페이지에 데이터가 효과적으로 표시됩니다.

PHP 코드:

연결:

<?php
$con=mysqli_connect("localhost","root","");
mysqli_select_db("simple_ajax",$con);
  • 이 섹션에서는 MySQL 연결을 설정하고 "simple_ajax" 데이터베이스를 선택합니다.

문의 및 응답:

$result=mysqli_query("select * from users",$con);
echo "<table border='1' >...";
while($data = mysqli_fetch_row($result)){ 
     // Display the fetched data in HTML table format 
}
echo "</table>";
  • 쿼리는 "users" 테이블에서 모든 레코드를 검색합니다.
  • 결과가 반복되고 각 행의 데이터가 HTML 내에 표시됩니다.

결론:

수정된 단계를 따르면 jQuery AJAX를 사용하여 MySQL 데이터베이스에서 데이터를 성공적으로 검색하고 프런트엔드에 다음과 같이 채울 수 있습니다. 원하는. 이 접근 방식을 사용하면 전체 페이지를 다시 로드할 필요 없이 동적 및 대화형 웹 애플리케이션을 사용할 수 있습니다.

위 내용은 jQuery AJAX를 사용하여 MySQL 데이터를 어떻게 검색할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.