선택된 값에 해당하는 db정보를 바로 불러오려면

선택된 값에 해당하는 db정보를 바로 불러오려면

QA

선택된 값에 해당하는 db정보를 바로 불러오려면

본문

tb에서 선택된 값에 해당하는 db정보를 체크박스로 표시하고 싶은데 체크박스값은 반영되는데 페이지 새로고침을 해야만 그 값이 반영되네요..
ajax로 설정해도 오로지 새로고침할 때만 정상 반영되는데 어떻게 해야할까요?


$projectlist = array();
$sql_project = sql_query("select project,mb_id from helpdesk where gubun = 1");
while ($row = sql_fetch_array($sql_project)) {
    $projectlist[] = $row;
}
 
// 아이디 불러오는 쿼리
$project1 = array();
$sql_project1 = sql_query("select * from g5_member");
while ($row = sql_fetch_array($sql_project1)) {
    $project1[] = $row;
}
 
// 아이디에 프로젝트 명이 이미 선택되어 있는지 확인하는 배열 생성
$selectedProjects = array();
$mb_id = $_GET['mb_id'];
$sql_selected_projects = sql_query("SELECT project FROM helpdesk WHERE mb_id = '{$mb_id}' GROUP BY project");
while ($row = sql_fetch_array($sql_selected_projects)) {
    $selectedProjects[] = $row['project'];
}

 
// 프로젝트명 신규추가 쿼리
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    if (isset($_POST['project'])) {
        $project_name = $_POST['project'];
        $sql = "INSERT INTO helpdesk (project, gubun) VALUES ('{$project_name}', 1);";
        sql_query($sql);
        // 추가된 프로젝트 목록을 반환
        $updated_project_list = get_updated_project_list();
        echo json_encode($updated_project_list);
        exit;
    }
 
    header('Location: ' . $_SERVER['REQUEST_URI']);
    exit;
}
 
// 아이디에 프로젝트 부여해주는 쿼리
if ($_SERVER['REQUEST_METHOD'] === 'GET') {
    if (isset($_GET['co_id']) && isset($_GET['mb_id']) && isset($_GET['project'])) {
        $co_id = $_GET['co_id'];
        $mb_id = $_GET['mb_id'];
        $project = $_GET['project'];
        $sql = "INSERT INTO helpdesk (project, gubun, mb_id) VALUES ('{$project}', 2, '{$mb_id}');";
        sql_query($sql);
        // 추가된 프로젝트 목록을 반환
        $updated_project_list = get_updated_project_list();
        echo json_encode($updated_project_list);
        exit;
    }
}
 
// 추가된 프로젝트 목록을 반환하는 함수
function get_updated_project_list() {
    global $mb_id;
    $updated_project_list = array();
    $sql_updated_projects = sql_query("SELECT project FROM helpdesk WHERE mb_id = '{$mb_id}' GROUP BY project");
    while ($row = sql_fetch_array($sql_updated_projects)) {
        $updated_project_list[] = $row['project'];
    }
 
    return $updated_project_list;
 
}


이 부분이 sql문 셋팅하는 곳이고

$(document).off("click", ".link_s1");
    $(document).on("click", ".link_s1", function() {
        var mb_id = $(this).text();
        var params = new URLSearchParams(window.location.search);
        var co_id = params.get('co_id'); // URL에서 co_id 값을 가져옴
        var co_id = params.get('co_id'); // URL에서 co_id 값을 가져옴
        var baseUrl = window.location.href.split('?')[0];
        var url = baseUrl + "?co_id=" + co_id + "&mb_id=" + mb_id;
        var projectVal = $(this).val();
        history.pushState({}, null, url);

 
         $.ajax({
            url: url, // 수정 필요
            type: 'GET',
            data: { co_id: co_id, mb_id: mb_id, project: projectVal },
            dataType: 'json',
            success: function(response) {
                // 프로젝트 목록을 업데이트
                updateProjectList(response);
 
                console.log(response);
 
            }
        });
 
        $(".headLink").removeClass("over");
        $(this).parent().addClass("over");
    });
 
$(document).on("change", "input[name='xxx']", function() {
    $("input[name='xxx']").not(this).prop('checked', false);
    var projectVal = $(this).val();
    var isChecked = $(this).is(":checked");
    if(isChecked) {
        var params = new URLSearchParams(window.location.search);
        var co_id = params.get('co_id'); // URL에서 co_id 값을 가져옴
        var mb_id = params.get('mb_id'); // URL에서 mb_id 값을 가져옴
 
        // URL에서 기존의 co_id와 mb_id를 가져온 후, 새로운 값으로 업데이트
       
        // history.pushState({}, null, updatedUrl);
        // console.log(mb_id);
 
        // AJAX 요청을 보냄
       
    }
});
 
function updateProjectList(projects) {
    // 서버에서 받아온 프로젝트 목록을 기준으로 체크박스 업데이트
    $("input[name='xxx']").each(function() {
        var projectVal = $(this).val();
        var isChecked = projects.includes(projectVal);
        $(this).prop('checked', isChecked);
    });
}

여기가 스크립트 부분입니다.

이 질문에 댓글 쓰기 :

답변 2

새로고침하면 반영되는것이 아니구요 이미반영은 된겁니다. 따라서 새로고침 하지않아도 적용된것을 보고자 한다면 동적 인 업데이트 처리를 해주시기 바랍니다.

 

console.log(response); 삭제 해주시고

그리고 서버로변경된 데이타를 UI요청하면되는데 현재 보시면 

url: url, 이url 값이 없습니다. url을 실제 경로를 지정해 주시기바랍니다.

해주시고 않되면 말씀하세요 경로설정을 안해서 새로고침 반영된데이타를 볼수잇는것 같습니다.

감사합니다.
일단
    $(document).off("click", ".link_s1");
    $(document).on("click", ".link_s1", function() {
        var mb_id = $(this).text();
        var params = new URLSearchParams(window.location.search);
        var co_id = params.get('co_id'); // URL에서 co_id 값을 가져옴
        var co_id = params.get('co_id'); // URL에서 co_id 값을 가져옴
        var baseUrl = window.location.href.split('?')[0];
        var url = baseUrl + "?co_id=" + co_id + "&mb_id=" + mb_id;
        var projectVal = $(this).val();
        console.log(url);


        $.ajax({
            url: url,
            type: 'GET',
            data: { co_id: co_id, mb_id: mb_id, project: projectVal },
            dataType: 'json',
            success: function(response) {
                // 프로젝트 목록을 업데이트
                updateProjectList(response);

                console.log(url);
 
            }
        });

        $(".headLink").removeClass("over");
        $(this).parent().addClass("over");
    });
말씀하신 부분에 대해서 저는 지금 url을 변수로 지정해서 실제로 ajax안에서 url처리를 이런식으로 하고 있는데 console.log로 url을 찍어보면 제가 현재 있는 실제 경로가 정상적으로 찍히고 있습니다.
그런데 ajax안에서 저렇게 문제가 되고 있는데요 ajax안에서만 이렇게 처리가 안되는걸까요?

var url = baseUrl + "?co_id=" + co_id + "&mb_id=" + mb_id; 이게 경로인가요?
내가 잘못봤네요 ---;;네그렇네요 ;; 그렇면 이렇게 해보세요

$(document).on("change", "input[name='xxx']", function() {
    $("input[name='xxx']").not(this).prop('checked', false);
    var projectVal = $(this).val();
    var isChecked = $(this).is(":checked");
    if (isChecked) {
        var params = new URLSearchParams(window.location.search);
        var co_id = params.get('co_id'); // URL에서 co_id 값을 가져옴
        var mb_id = params.get('mb_id'); // URL에서 mb_id 값을 가져옴

        $.ajax({
            url: url,
            type: 'GET',
            data: { co_id: co_id, mb_id: mb_id, project: projectVal },
            dataType: 'json',
            success: function(response) {
                updateProjectList(response);
            }
        });
    }
});

1. 일단 F12로 개발자모드 여시고...

Network > Fetch/XHR 가셔서...

정상적으로 데이터 주고 받는지 부터 확인하세요

 

2. 개발자 모드에서 Console 에 오류가 표시되는지 확인하세요.

답변을 작성하시기 전에 로그인 해주세요.
전체 123,996 | RSS
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT