如何使用AJAX从数据库中获取数据并在页面上显示[关闭]

Question

I'm working in a project and I'm stuck here, I don't know why I can't get the list from my database\

Here is my JAVASCRIPT

$(document).ready(function(){
    $.ajax({
        url:'datos.php?accion=ac',
        success:function(datos){
            for(x = 0;x<datos.length;x++){
                //$("#PAIS").append("<option value='"+datos[x].id_pais+"'>"+datos[x].pais+"</option>");
                $("#PAIS").append(new Option( datos[x].pais, datos[x].id_pais));
            }
        }
    })

    $("#PAIS").change(function(){
        //var felix=$('#PAIS option:selected').val();
        //alert(felix);
         $.ajax({
            url:'datos.php?accion=ad',
            alert('hola22');
            success:function(datos1){
                console.log("hola");   
                for(x = 0;x<=datos1.length;x++){
                 //$("#PAIS").append("<option value='"+datos[x].id_pais+"'>"+datos[x].pais+"</option>");
                  $("#REGION").append(new Option( datos1[x].region, datos1[x].id_region));
            }
    }
        })
    });
})

And my functions.php:

<?php
    $server="localhost";
    $usr="root";
    $passwd="";
    $data="combo";
    $db=mysqli_connect($server,$usr,$passwd,$data) or die ("Error en la conexion1");
    $Accion = $_GET['accion'];
    if($Accion=="ac"){
        header('Content-Type: application/json');
        $paises = array();
        $Consulta = mysqli_query($db,"SELECT * FROM paises")or die ("Error en la conexion7"); 
        while($Fila=mysqli_fetch_assoc($Consulta)){
            $paises[] = $Fila;
        }
        echo json_encode($paises);
    }
    if($Accion=="ad"){      
        header('Content-Type: application/json');
        $regiones = array();
        $Consulta1 = mysqli_query($db,"SELECT * FROM regiones WHERE id_pais=4");//.$_REQUEST['id_pais']);
        while($Fila=mysqli_fetch_assoc($Consulta1)){
            $regiones[] = $Fila;
            //echo json_encode($Fila);      
        }
        echo json_encode($regiones);
    }
?>

Well, my problem it's that I really don't know how the first really works :D, but when I'm calling url:datos.php=ad this block doesn't work :/

Answer 1

First, you will find it helpful to review these simple examples about AJAX. Do not just read them, copy them to your server and make them work. Change a few names or values -- see how they work.

AJAX request callback using jQuery

Next, here is a post that gives an overview to how PHP / web page / AJAX all work together. Take a few minutes and read it carefully. See if you can follow the logic. I bet the lightbulb will come on for you.

PHP - Secure member-only pages with a login system

---

Make your code as standard as possible. Don't take any shortcuts. Use the full $.ajax() structure, not the shortcuts of $.post() or $.get() (these are both shortcut forms of $.ajax(). Don't skip anything. As you get better, you can start to take some shortcuts. But for now, make sure your AJAX code block looks like this:

var var_value = $('#someElement').val();

$.ajax({
    type: 'post',
     url: 'your_ajax_processor.php',
    data: 'post_var_name=' +var_value,
    success: function(dataz){
        if (dataz.length) alert(dataz);
        $('body').append(dataz);
    }
});

In your PHP, you will receive the value you posted in the $_POST array variable. If, in AJAX, you named your variable post_var_name (as we did in the example above), then that is how you access the contents:

$myVar = $_POST['post_var_name'];

When you are having trouble, a great idea is to put in some tests. (1) On the PHP side, comment out everything and at the top put in an echo command, like:

<?php
echo 'I got here';
die();

Back on the web page, in the AJAX success function, just alert what you get:

success: function(d){
    alert(d);
}

At that point, you know two things:

1. Your AJAX -to- PHP communications are working, and

2. You see what value got passed over to PHP.

Then, you might do something like this

js/jQuery:

var var_value = $('#someElement').val();

$.ajax({
    type: 'post',
     url: 'your_ajax_processor.php',
    data: 'post_var_name=' +var_value,
    success: function(dataz){
        if (dataz.length) alert(dataz);
        $('body').append(dataz);
    }
});

PHP:

<?php

    $myVar = $_POST['post_var_name'];

    //Now you can do something with variable `$myVar`, such as:
    $out = '
        <div class="red-background"> '.$myVar.' </div>
    ';

    //This content is received in the AJAX code block using the variable name you specified: "dataz"
    echo $out;