테스트 사이트 - 개발 중인 베타 버전입니다

switch 는 Ajax로 myslq update 어떻게 하나요? 채택완료

울라프 7개월 전 조회 2,597

http://sir.kr/data/editor/2503/3625505405_1743127594.935.png" width="259" />

 

 

샘플 좀 볼 수 있을까요?

 

 

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

채택된 답변
+20 포인트
7개월 전

위에 챗GTP 는 그누보드용이 아니니 참고만 하시고

간단한 예제 알려드릴께요.

 

우선 해당 페이지에 스위치시 input 값을 넣던지 아니면 radio 자체로 만들던지 하고

아래 펑션을 호출하세요.

 

</p>

<p><script type="text/javascript"></p>

<p>    function adp_ajaxscript(){ // 실행할 명령어</p>

<p>        $.ajax({</p>

<p>            type: "POST",</p>

<p>            url: "ajax.php", // 불러올 아작스 파일</p>

<p>            data: {</p>

<p>                "data1":$("input[name='해당inputname']").val(),</p>

<p>                "data2":$("input[name='해당inputname']").val(),</p>

<p>                "data3":$("input[name='해당inputname']").val()</p>

<p>            },</p>

<p>            success: function(msg){</p>

<p>                if(msg == "ok"){</p>

<p>                    location.reload();</p>

<p>                }else{</p>

<p>                    alert('저장에 실패했습니다.');</p>

<p>                }</p>

<p>            },</p>

<p>            error : function() {</p>

<p>                alert('오류가발생했습니다 - 에러코드 : adp_ajaxscript');</p>

<p>            }</p>

<p>        });</p>

<p>    }</p>

<p></script> </p>

<p>

 

이렇게 스크립트로 해당 데이터를 ajax.php 로 넘깁니다.

그러면 ajax.php 에서

 

</p>

<p>include_once('./_common.php'); // 커먼 파일은 알아서 로드</p>

<p>$data1 = $_POST['data1'];</p>

<p>$data2 = $_POST['data1'];</p>

<p>$data3 = $_POST['data1'];</p>

<p>$adp_ajaxsql = "여기에 넣고 싶은 쿼리문"; </p>

<p>$result = sql_query($adp_ajaxsql);</p>

<p>if($result){ // 성공?</p>

<p>      echo 'ok';</p>

<p>      return;</p>

<p>}</p>

<p>echo 'no'; // 실패</p>

<p>

 

이렇게 하시면 업데이트가 성공하면 새로고침 될것이고 아니면 alert 오류가 나올거에요.

 

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

핑크빈
7개월 전

switch(스위치)를 Ajax로 MySQLUPDATE하는 방법은 다음과 같습니다.
이 과정은 HTML + jQuery (Ajax) + PHP + MySQL을 사용하여 구현됩니다.


1. HTML - Switch 버튼 만들기

<input type="checkbox" class="toggle-switch" data-id="1">
  • data-id 속성을 사용하여 데이터베이스에서 업데이트할 레코드의 ID를 저장합니다.


2. jQuery + Ajax - 스위치 변경 시 Ajax 요청

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){
    $(".toggle-switch").on("change", function(){
        var id = $(this).data("id");  // 레코드 ID 가져오기
        var status = $(this).prop("checked") ? 1 : 0; // 체크 상태 확인

        $.ajax({
            url: "update_status.php", // 요청할 PHP 파일
            type: "POST",
            data: { id: id, status: status }, // 전송할 데이터
            success: function(response) {
                alert("업데이트 성공: " + response);
            },
            error: function() {
                alert("오류 발생!");
            }
        });
    });
});
</script>
  • on("change") 이벤트를 사용하여 스위치가 변경될 때 Ajax 요청을 보냅니다.

  • data-id로 식별자(id)를 가져옵니다.

  • .prop("checked")를 사용하여 상태를 1(ON) 또는 0(OFF)로 설정합니다.

  • $.ajax()를 이용해 POST 요청을 보냅니다.


3. PHP - MySQL 업데이트 처리 (update_status.php)

<?php
$host = "localhost";
$user = "root";
$pass = "";
$dbname = "your_database";

$conn = new mysqli($host, $user, $pass, $dbname);
if ($conn->connect_error) {
    die("연결 실패: " . $conn->connect_error);
}

$id = $_POST['id'];
$status = $_POST['status'];

// SQL 업데이트 실행
$sql = "UPDATE your_table SET status = ? WHERE id = ?";
$stmt = $conn->prepare($sql);
$stmt->bind_param("ii", $status, $id);

if ($stmt->execute()) {
    echo "성공";
} else {
    echo "실패: " . $conn->error;
}

$stmt->close();
$conn->close();
?>
  • MySQLi를 사용하여 UPDATE 쿼리를 실행합니다.

  • bind_param("ii", $status, $id)를 사용하여 SQL 인젝션을 방지합니다.


4. MySQL 테이블 구조 예시

CREATE TABLE your_table (
    id INT PRIMARY KEY AUTO_INCREMENT,
    name VARCHAR(100),
    status TINYINT(1) DEFAULT 0
);
  • status 컬럼을 TINYINT(1)로 설정하여 0 또는 1 값을 저장합니다.


정리

  1. HTML에서 switch(체크박스) 클릭 이벤트를 감지

  2. jQuery + Ajax를 사용하여 서버로 idstatus를 전송

  3. PHP에서 MySQL UPDATE 실행

  4. Ajax의 success 콜백으로 결과 처리

chatgpt 답변입니다.

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인