• 회원가입
  • 로그인
  • 구글아이디로 로그인

[AJAX] JS - AJAX - DB 아작스 예제 ★ (= 데이터베이스 정보 가져오기) ※ select 태그 option 값 변경 시 ajax로 관련 값 호출


b.php (앞단) 

 

<style>

table,th,td {

border:1px solid silver;

border-collapse:collapse;

padding:10px;

}

</style>


<form action=""> 

  <select name="mb_id" onchange="hz(this.value)">

    <option value="">아이디 선택</option>

    <option value="aaa">aaa</option>

    <option value="bbb">bbb</option>

    <option value="ccc">ccc</option>

  </select>

</form>


<div id="txtHint">회원정보 출력위치</div>


<script>

function hz(str) {

  var xhttp;  

  if (str == "") {

    document.getElementById("txtHint").innerHTML = "";

    return;

  }

  xhttp = new XMLHttpRequest();

  xhttp.onreadystatechange = function() {

    if (this.readyState == 4 && this.status == 200) {

      document.getElementById("txtHint").innerHTML = this.responseText;

    }

  };

  xhttp.open("GET", "a.php?q="+str, true);

  xhttp.send();

}

</script>

 


a.php (뒷단)

 

<?php

$mysqli = new mysqli("localhost", "root", "autoset", "mw7"); // DB 연결 (호스트,아이디,비번,DB명)

if($mysqli->connect_error) {

  exit('연결 실패');

}


$sql = "SELECT mb_id, mb_name, mb_level, mb_point FROM g5_member WHERE mb_id = ?";


$stmt = $mysqli->prepare($sql);

$stmt->bind_param("s", $_GET['q']);

$stmt->execute();

$stmt->store_result();

$stmt->bind_result($mb_id, $mb_name, $mb_level, $mb_point);

$stmt->fetch();

$stmt->close();


echo "<table>";

echo "<tr>";

echo "<th>아이디</th>";

echo "<th>닉네임</th>";

echo "<th>레벨</th>";

echo "<th>포인트</th>";

echo "</tr>";

echo "<tr>";

echo "<td>" . $mb_id . "</td>";

echo "<td>" . $mb_name . "</td>";

echo "<td>" . $mb_level . "</td>";

echo "<td>" . $mb_point . "</td>";

echo "</tr>";

echo "</table>";

?>


PS. 다른 예제: https://homzzang.com/b/php-56

 

방문 감사합니다. (즐겨찾기 등록: Ctrl + D)

분류 제목
String JS - concat() 메서드 ★ - 문자열결합 (= 문자열합치기 = concat메서드 = 컨캣메서드)
String JS - endsWith() 메서드 - 지정문자열로 끝나는지(=종료) 여부 (IE12이상)
String JS - fromCharCode() 메서드 - 유니코드를 문자열로 변환
String JS - includes() 메서드 ★ - 지정문자열포함여부 (= includes메서드 = 인클루드즈메서드)
String JS - indexOf() 메서드(문자열) ★ - 처음일치문자열위치찾기 (= 문자열포함검사 = 인덱스어브메서…
String JS - lastIndexOf() 메서드(문자열) ★ - 마지막일치문자열위치찾기 (= 문자열포함검사 = 라스…
String JS - localeCompare() 메서드 - 문자열순서비교
String JS - match() 메서드 ★ - 일치하는 문자열 반환 (= match메서드 = 매치메서드) ※ 정규식 …
String JS - repeat() 메서드 - 지정횟수만큼 문자열반복 (= 리피트)
String JS - replace() 메서드(String용) ★ - 문자열 대체 (= replace메서드 = 리플레이스…
String JS - search() 메서드 - 문자열위치찾기 ※ 문자열포함검사
String JS - slice() 메서드 - 문자열 자르기 (= 문자열 일부 추출 = slice메서드 = 슬라이스 메서…
String JS - split() 메서드 - 문자열 쪼개기 (= split메서드 = 스플릿 메서드) ※ 이메일숨기기 (…
String JS - startsWith() 메서드 - 지정문자열로 시작 여부 (IE12이상)
String JS - substr() 메서드 ★ - 문자열 자르기 - 문자열의 특정 위치 이후의 특정 길이 만큼 반환
String JS - substring() 메서드 ★ - 문자열 일부 추출 (= 문자열 자르기 = substring메서드…
String JS - toLocaleLowerCase() 메서드 - 로캘 소문자로 변환
String JS - toLocaleUpperCase() 메서드 - 로캘 대문자로 변환
String JS - toLowerCase() 메서드 - 소문자로변환
String JS - toString() 메서드 (문자열경우) - 문자열타입으로 변경 (= toString메서드 = 투스…
6/67
목록
찾아주셔서 감사합니다. Since 2012