Hướng dẫn how to get php data in jquery - cách lấy dữ liệu php trong jquery

Tôi có tệp .php và tôi có tệp js. Tôi đang cố gắng làm biểu đồ thanh. Bây giờ tôi đã chọn một số dữ liệu vào cơ sở dữ liệu của mình. Và bây giờ tôi không biết làm thế nào tôi có thể lấy dữ liệu từ tệp .php sang tệp .js.

Tôi có mã này:

//.js tập tin

var data, options;

// replace this data with my selected data
data = {
    labels: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
    series: [
        [19, 29, 28, 44, 39, 48, 54],
    ]
};

options = {
    height: 300,
    showArea: true,
    showLine: true,
    showPoint: true,
    fullWidth: true,
    axisX: {
        showGrid: false
    },
    lineSmooth: false,
};

new Chartist.Line['#headline-chart', data, options];

/Tệp php/PHP FILE/

    $chart6 = $controller->runQuery["SELECT DATE[pay_date] `DATE`, SUM[amount] daily_amount, DATE_FORMAT[pay_date,'%a'] DAYNAME FROM tbl_paid WHERE DATE[pay_date] BETWEEN DATE[:today] - INTERVAL 1 WEEK AND DATE[:today] GROUP BY DATE[pay_date];"]; 
    $chart6->execute[array[":today"=>$today]];
    while[$fetch = $chart6->fetch[PDO::FETCH_ASSOC]]
   {
          $data ="{labels:".$fetch['DATE']."-".$fetch['DAYNAME']." series:".$fetch['daily_amount']."}";
   }

JQuery AJAX rất hữu ích khi bạn muốn đăng hoặc nhận dữ liệu từ tập lệnh PHP mà không cần làm mới trang. Nói chung, bạn trả lại chuỗi vào cuộc gọi AJAX để cập nhật một phần của trang web. Nhưng đôi khi yêu cầu lấy dữ liệu đối tượng hoặc mảng từ tệp PHP để hiển thị các giá trị trong khu vực khác nhau. Sử dụng phương thức $.get data from PHP script without page refresh. Generally, you return the string to Ajax call for updating a part of the web page. But sometimes requires getting the object or array data from PHP file for showing values in the different area. Using $.ajax[] method in jQuery you can get JSON data from a file and set in the HTML element.

Trong hướng dẫn này, chúng tôi sẽ chỉ cho bạn cách xử lý yêu cầu AJAX bằng JQuery và gọi tập lệnh PHP trả về dữ liệu JSON. Tập lệnh PHP sẽ tìm nạp dữ liệu từ cơ sở dữ liệu MySQL và trả dữ liệu JSON về AJAX. Dữ liệu được trả về được phân tích cú pháp bằng cách sử dụng JavaScript và đặt các giá trị thành các phần tử cụ thể.returns JSON data to Ajax. The returned data is parsed using JavaScript and set values to the specific elements.

JQuery Ajax Gọi cho tập lệnh PHP với JSON Return

Để hiểu rõ hơn của bạn, chúng tôi sẽ tìm nạp chi tiết người dùng từ cơ sở dữ liệu dựa trên ID người dùng thông qua cuộc gọi AJAX bằng JQuery, PHP và MySQL.

Tạo bảng cơ sở dữ liệu

Bảng users giữ thông tin cơ bản của người dùng. Tập lệnh ví dụ của chúng tôi sẽ lấy chi tiết người dùng từ bảng Demo [người dùng] này.

CREATE TABLE `users` [
 `id` int[11] NOT NULL AUTO_INCREMENT,
 `name` varchar[100] COLLATE utf8_unicode_ci NOT NULL,
 `email` varchar[100] COLLATE utf8_unicode_ci NOT NULL,
 `phone` varchar[15] COLLATE utf8_unicode_ci NOT NULL,
 `created` datetime NOT NULL,
 `modified` datetime NOT NULL,
 PRIMARY KEY [`id`]
] ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;

Mã HTML

Ban đầu, một hộp đầu vào được hiển thị để cung cấp ID người dùng có chi tiết bạn muốn truy xuất. Nút GET GET Chi tiết bắt đầu yêu cầu AJAX và các chi tiết người dùng tương ứng được hiển thị dưới hộp đầu vào.

    User Details
    Name: 
    Email: 
    Phone: 
    Register Date: 

Mã JavaScript [JQuery & Ajax]

Phương thức $.ajax[] Thực hiện yêu cầu AJAX và đăng ID người dùng lên tệp PHP để lấy chi tiết người dùng từ cơ sở dữ liệu. Nếu yêu cầu thành công, dữ liệu được trả về từ máy chủ dưới dạng định dạng được chỉ định trong tham số dataType. Trong tập lệnh ví dụ của chúng tôi, JSON được chỉ định trong dataType, dữ liệu sẽ được trả về dưới dạng định dạng JSON. Dữ liệu JSON được phân tích cú pháp vào nội dung phần tử tương ứng.

$[document].ready[function[]{
    $['#getUser'].on['click',function[]{
        var user_id = $['#user_id'].val[];
        $.ajax[{
            type:'POST',
            url:'getData.php',
            dataType: "json",
            data:{user_id:user_id},
            success:function[data]{
                if[data.status == 'ok']{
                    $['#userName'].text[data.result.name];
                    $['#userEmail'].text[data.result.email];
                    $['#userPhone'].text[data.result.phone];
                    $['#userCreated'].text[data.result.created];
                    $['.user-content'].slideDown[];
                }else{
                    $['.user-content'].slideUp[];
                    alert["User not found..."];
                } 
            }
        }];
    }];
}];

Tập lệnh PHP [getData.php]

Tập lệnh PHP này được gọi theo yêu cầu AJAX. Dựa trên ID người dùng, các chi tiết được tìm nạp từ cơ sở dữ liệu bằng PHP và MySQL. Dữ liệu được truy xuất trả về định dạng JSON cho AJAX.